1

私のhtmlテキストリンクのほとんどは次のように定義されています：

a:hover {text-decoration:none; border-bottom:2px dotted #DB8D41}

しかし、私はhttp://communitychessclub.com/rabren/にもリンクである画像を持っています。これらの画像の下に「border-bottom：2pxdotted＃DB8D41」を表示したくありません。

以下が機能しないことは明らかです。

a:hover img {border:none}
img, img:active { border: none }

誰かが解決策を持っていますか？

4

1 に答える 1

1

これはうまくいくようです：http：//jsfiddle.net/44Pwr/

html

<div><a href=#"><img src="http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif"></a><p>This is <a href="#">another link</a></p></div>

css

body { padding: 10px; background: #003; color: #999; }

a:link, a:visited { border-bottom: 1px solid #009; text-decoration: none; color: #CCC; }

a:hover, a:active { border-bottom: 1px solid #CCC; text-decoration: none; color: #CCC; }

a > img { display: block; border-bottom: 0; }
于 2012-11-05T11:27:12.013 に答える