3

リンク:hoverの疑似セレクターの動作を削除しようとしています。:afterしかし、それは不可能だと思います。

a {
  font-family: Georgia, "Times New Roman", Times, serif;
  font-style: italic;
  font-size: 12px;
  color: #666;
  text-decoration: none
}

a:after {
  content: "·";
  margin: 0 2px 0 6px
}

a:hover {
  text-decoration: underline
}

a:hover:after {
  text-decoration: none
}
<a href="#">test</a>
<a href="#">test</a>
<a href="#">test</a>

JsFiddleをチェックアウトします。

出来ますか？

4

2 に答える 2

6

spanこれを処理する最も簡単な方法は、各リンクのテキストをラップすることです。

<a href="#"><span>test</span></a>

のみ:hoverがspan与えられtext-decoration: underlineます：

a:hover span {text-decoration: underline}

参照: http://jsfiddle.net/thirtydot/3N9vs/27/

同様の古い質問:子要素のテキスト装飾を元に戻すこともできません
関連: CSS テキスト装飾プロパティを子要素でオーバーライドすることはできません

于 2012-04-12T11:28:57.517 に答える
4

:after疑似要素position:absolute;を与えて、それmarginをシフトするために与える必要があります。また、コンテンツが正しく表示display:inline-block;されるためには、アンカーが必要です。:after

参照: http://jsfiddle.net/ECFBR/

于 2012-04-12T11:13:38.463 に答える