一部分のリンクのCSSを無効にしたい

質問

HP全体、リンクの箇所にカーソルを持って行くとバックの色が変わるように設定をしています。
（a:hover の ｂackground-color を設定）

しかし、一部のロゴ画像で、背景が透明色のものがあり、そのロゴ画像にリンクを貼ると、画像までロゴのバックが変わってしまいます。

ロゴの画像は、ロゴの下に写真を配置しているため、透明色を白に加工しなおすことができません。

この画像にマウスをおいても、背景が変わらないように（下の写真が見えているように）したいのですが、よい方法がありますでしょうか。

何かございましたら、ご教授下さい。
よろしくお願い致します。

回答No.2

naokita · ベストアンサー

ここでは、ソースを提示して質問した方が正しく解決できるでしょう。
#1さんの詳細度（CSS）が分からなければ、
アンカーに直接classを付与してimportant指定するしかないです。

a.trans:hover{background-color:Transparent !important;}

<a href="#" class="trans"><img /></a>

お礼

ありがとうございました。

できました！！

詳細度は・・・よくわかりませんでした・・・。
勉強します。。

ありがとうございました。

回答No.1

ORUKA1951

a:hover{}でしたら、詳細度は、[0,0,1,1]ですから、子孫セレクタか何かを使って、詳細度をそれより上げればよいだけです。カスケーディングスタイルシートの「カスケーディング」を使います。CSSの命と言っても良い重要な部分です。
　そのリンク部分のDOMツリーを教えてください。
BODY
　|-- DIV.header
　　　　|-- DIV.nav
　　　　　　　|-- OL
　　　　　　　　　|-- LI
　　　　　　　　　　　|-- A
　　　　　　　　　　　　　|-- IMG
とか・・