7.リンク部分の指定方法
HTML(XHTML)においてリンクはa要素で表現しますが、一般にリンク部分は状態によって表示が変化するという特性があります。
そこでリンクの状態別にスタイルを適用できるようにするため、「疑似クラス」という特別な書式が用意されています。
a要素で使用できる疑似クラスは以下の通りです。
a:link | まだリンク先を訪問していない状態 |
a:visited | すでにリンク先を訪問した状態 |
a:hover | 指定された要素上にマウスカーソルが重なっている状態 |
a:active | リンクをクリックするなどアクティブとなった状態 |
まだ訪れていないリンクを示す場合はa要素の「a」に続けて「:link」、すでに見たリンクを示す場合は同様に「:visited」を記述。
またカーソルが上にある状態については「:hover」、マウスボタンが押された状態を示すには「:active」を続けて指定します。
これら4種類のスタイルを続けて指定する場合には、掲載した順に書かなければ意図した状態にならない場合があるので注意しましょう。
a:link{}
a:visited{}
a:hover{}
a:active{}
という順番です。ノーマルな状態→訪問済み→マウスを乗せた状態→クリックした時、ですね。
<< PAGE TOP >>