.
CSS Reference_________
.
.
.
.
TOPページ(Alt+B)
.
その他のスタイル指定

a: リンク

リンクについて、未訪問、既訪問、マウスでクリックしたとき、マウスにリンクが触れたときのそれぞれの指定を行う。未訪問は「a: link」で、既訪問は「a: visited」で、マウスでクリックしたときは「a: active」で、マウスがリンクで触れたときは「a: hover」で指定する。

a:link {
color: #0000ff;
background-color: transparent;
text-decoration: none;
}
a:visited {
color: #0000ff;
background-color: transparent;
text-decoration: none;
}
a:active {
color: #ff1493;
background-color: transparent;
text-decoration: none;
}
a:hover {
color: #ff1493;
background-color: transparent;
text-decoration: underline;
}

上記はリンク色を青に設定しておき、リンクに下線を表示させない。マウスがリンクに触れたときリンク色が赤になり、下線を表示させる。a:リンク指定時の注意点は、「a:hover指定を行う際は他のa:指定よりも後、つまり最後尾に表記しなければならない」ということです。

cursor: カーソルの形

カーソルの形を指定する。形の指定には「crosshair」、「default」、「move」、「e-resize」、「ne-resize」、「nw-resize」、「n-resize」、「se-resize」、「sw-resize」、「s-resize」、「w-resize」、「text」、「wait」、「help」、「pointer」が指定できる。

crosshair   default   move   e-resize   ne-resize   nw-resize   n-resize   se-resize   sw-resize   s-resize   w-resize   text   wait   help   pointer

それぞれの文字の上にカーソルを置いてみてください。

list-style-type: 項目リストの表示方法

HTMLのOL要素の表示方法を指定する。指定には「disc」、「circle」、「square」、「decimal」、「lower-roman」、「upper-roman」、「lower-alpha」、「upper-alpha」が指定できる。

<ol style="list-style-type: disc"><li>項目リスト</li><li>表示方法</li></ol> と指定した場合は
  1. 項目リスト
  2. 表示方法

のようになる。また「circle」、「square」、「decimal」、「lower-roman」、「upper-roman」、「lower-alpha」、「upper-alpha」の順に

  1. 項目リスト
  2. 表示方法
  1. 項目リスト
  2. 表示方法
  1. 項目リスト
  2. 表示方法
  1. 項目リスト
  2. 表示方法
  1. 項目リスト
  2. 表示方法
  1. 項目リスト
  2. 表示方法
  1. 項目リスト
  2. 表示方法

のようになる。

list-style-image: url（'画像のパスと画像ファイル名'）

項目リストの頭に画像を挿入する。

角画像の画像を使って <ol style="list-style-image: url('list-image.gif')"><li>項目リスト</li><li>表示方法</li></ol> と指定した場合は
  1. 項目リスト
  2. 表示方法

のようになる。

list-style-position:

項目リストの位置を指定する。指定にはマーカーが外に出る「outside」（デフォルト）、マーカーを中に収める「inside」が指定できる。

<ol style="list-style-type: disc"><li>項目リスト</li><li>表示方法</li></ol> と指定した場合は
  1. 項目リスト
  2. 表示方法

となるのに対し

<ol style="list-style-type: disc; list-style-position: inside"><li>項目リスト</li><li>表示方法</li></ol> と指定した場合は

  1. 項目リスト
  2. 表示方法

のようになる。

list-style: 項目リストの指定

項目リストの各指定「list-style-type」、「list-style-image」、「list-style-position」をまとめて指定する。

<ol style="list-style: disc inside"><li>項目リスト</li><li>表示方法</li></ol>
  1. 項目リスト
  2. 表示方法

scrollbar-*: スクロールバーの色

スクロールバーの色（見栄え）を指定する。インターネットエクスプローラー5.5以降のみでの対応となる。「scrollbar-3dlight-color」、「scrollbar-arrow-color」、「scrollbar-base-color」、「scrollbar-darkshadow-color」、「scrollbar-face-color」、「scrollbar-highlight-color」、「scrollbar-shadow-color」の7つを組み合わせて指定する。

body {
scrollbar-highlight-color: #ffffff;
scrollbar-shadow-color: #ffffff;
scrollbar-arrow-color: #ffffff;
scrollbar-face-color: #000080;
scrollbar-3dlight-color: #dddddd;
scrollbar-track-color: #dddddd;
scrollbar-darkshadow-color: #dddddd;
}

当ページは上記のように指定している。

リファレンスTOP(Alt+R)

CopyRight (C) 2000-2013 by T.Shiraishi All right reserved　無断転載禁止／リンクフリー