質問: Movabletype 3.36にてサイトを制作しています。 スタイルシートで a:hover {background-color: #ffd78c;} と指定し、リンク部にマウスカーソルが来た時に背景色が変わるようになったところまでは良かったのですが、エントリーのタイトル部にアンカーを引くため タグを使ったところ、被リンクにあたるアンカーポイントまで(マウスオーバー時に)背景色が変わるようになってしまいました。 つまり、アンカーポイントとして指定したいエントリーのタイトルまで「リンク箇所」扱いになってしまっているため、の箇所だけスタイルシートを外すような指定をしたいのですが、何か対処方法はありませんか? 具体的なタグの記述等を教えていただけると大変助かります。 どなたか詳しい方、どうぞご返答をお願い致します。
回答: CSSの属性セレクタという物を使います。 ``` a[href]:hover {background-color: #ffd78c;} ``` このように記述するとタグにhrefの属性が指定されている物のみにスタイルが適用されます。 ただし、IE6(IE7は未確認)ではこの属性セレクタはサポートされませんが、 それとは別にIEではhover疑似クラスはhref属性が指定されている物のみ動作するようなので、 結果として目的の動作になると思います。 また、エントリーのアンカー部に適用したくないということならば、エントリーのタイトルがh2要素となっていれば ``` h2 a,h2 a:hover{ なんらかのスタイル } ``` というスタイルを記述すれば、h2要素中のアンカー要素にのみスタイルを適用することが出来ます。