liにclassを当てる場合の注意
2014年2月5日
とても簡単なことのハズが結構迷ってしまった。
きちんとcssを理解してないからだが。
liリストにクラスをあてて、アクティブなページのメニュー表示をハイライトしたい場合。
.exhibit-nav { float: right; width: 500px; height: 25px; padding-right: 30px; } .exhibit-nav ul { float: right; font-family: "ヒラギノ明朝 Pro W3","HG明朝E","MS P明朝","MS 明朝",serif; font-size: 90%; font-style: italic; } .exhibit-nav li,.exhibit-nav li a { float: left; padding-left: 15px; color: #666; text-decoration: none; } .exhibit-nav li a:hover { color: #ccc; text-decoration: none; } /*=========================================== ↓ここ、単に.current-catでは反応なし。 属するクラスに紐付けするための.exhibit-navが必要。 ===========================================*/ .exhibit-nav .current-cat a { color: #960002; }