CSSでのクラス付きリンク
ここで、リンク自体がクラスを持っているとします:
<a href="#" class="eee">リンク</a>
<a href="#" class="eee">リンク</a>
<a href="#" class="eee">リンク</a>
そのようなクラスを持つリンクにスタイルを設定してみましょう:
a:link.eee, a:visited.eee {
color: red;
}
a:hover.eee {
text-decoration: none;
}
リンクのクラスと状態擬似クラスを記述する順序は関係ありません。 順序を入れ替えても何も変わりません:
a.eee:link, a.eee:visited {
color: red;
}
a.eee:hover {
text-decoration: none;
}
以下のコードのセレクタが何を選択するか説明してください。 次に、そのセレクタに適合するHTMLコードを書いてください。 セレクタを含むコードは次の通りです:
a.zzz {
color: red;
}
a.zzz:hover {
text-decoration: none;
}
以下のコードのセレクタが何を選択するか説明してください。 次に、そのセレクタに適合するHTMLコードを書いてください。 セレクタを含むコードは次の通りです:
#block a.zzz {
color: red;
}
#block a.zzz:hover {
text-decoration: none;
}
以下のコードのセレクタが何を選択するか説明してください。 次に、そのセレクタに適合するHTMLコードを書いてください。 セレクタを含むコードは次の通りです:
.block a.zzz {
color: red;
}
.block a.zzz:hover {
text-decoration: none;
}