0

だから私は自分のサイトに 2 つのホバー画像を追加したいのですが、これを行うと、画像の真ん中に黒い境界線が切れてしまいます。これは、リンク効果にホバーしているためです。ここにコードがあります

a:hover,a:active
{
color:Black;
outline:ridge;
text-outline:#000;
text-decoration:underline;
font-size:20px;
font-style:italic;
font-style:bold;

}

スタックに関する同様の質問からこのコードを試しましたが、うまくいきませんでした。

a:hover img {

a img:hover{border: none !important;
}
4

3 に答える 3

0

試したコードは適切にフォーマットされていないようです。これを試して。

a:hover img, a img:hover{
     border: none !important;
}
于 2013-06-03T17:54:47.857 に答える
0

通常は避けることをお勧めし!importantます。この場合、画像とアンカーにクラスまたは ID を与えて、必要な CSS ルールを適用するだけです。

HTML:

<a class="link" href="#">Some link</a>
<img class="image" src="">

CSS:

.link:hover, .link:active {
  color:Black;
  outline:ridge;
  text-outline:#000;
  text-decoration:underline;
  font-size:20px;
  font-style:italic;
  font-style:bold;
}

.image:hover {
  border: none;
}
于 2013-06-03T18:00:49.657 に答える
0

サイト全体のすべてのタグでこのような攻撃的なスタイルを使用することは避けたいと思います...このような多くの頭痛の種になります. より厳密に制御するためにテキストを p タグでラップするか、@mrkou が提案するようなクラスをテキストまたは画像に与えてみてください。

フィドル: http://jsfiddle.net/Xs4tn/

p a:hover, p a:active {
  color:Black;
  outline:ridge;
  text-outline:#000;
  text-decoration:underline;
  font-size:20px;
  font-style:italic;
  font-style:bold;
}
于 2013-06-03T18:13:02.483 に答える