schedule2011.7.9

[css2]擬似クラスの簡単リスト|CSSプロパティ

CSS

擬似クラスの簡易リストです。

擬似クラスとは要素の単語末に記述することでマウスオーバー時に反応を与えたりと特殊な指定ができる。
基本はリンク要素で使う頻度が高い。
指定しても反映されていない場合、以下のリスト順に記述。

擬似クラス

:link

指定できる属性
  • a要素

未訪問のリンク要素に対してのスタイルを指示。
通常リンク以外で指定したいのであれば指定する。

a {color: blue;}

a:link {color: green;}

:visited

指定できる属性
  • a要素

一度開いた既訪問のリンク要素に対してのスタイルを指示。

a {color: blue;}

a:link {color: red;}

:hover

指定できる属性
  • 全て

マウスカーソルを要素の上に持ってきた場合の指定。

サンプル

マウスオン!!
div {padding: 1em; background-color: #f2f2f2;}

div:visited {padding: 2em; background-color: #c6c6c6;}

:active

指定できる属性
  • 全て

要素をクリックした場合の指定。

サンプル

Please クリック
div {padding: 1em; background-color: #f2f2f2;}

div:visited {padding: 2em; background-color: #c6c6c6;}

こちらのページは必要ではありませんか?

リンクタグの簡単リスト
[CSS2]スタイルシート全属性|早見表