删除：悬停在：元素之后

Question

我正在尝试删除:hover伪选择器中的:after行为以获取链接。但我认为这是不可能的。

http://jsfiddle.net/3N9vs/

有可能吗？

Answer 1

处理此问题的最简单方法是在每个链接的文本周围包裹span：

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

仅在:hover span text-decoration: underline {/ 1}}。

a:hover span {text-decoration: underline}

请参阅： http://jsfiddle.net/thirtydot/3N9vs/27/

类似的旧问题：Cannot undo text-decoration for child-elements
相关：CSS text-decoration property cannot be overridden by child element

Answer 2

您需要提供:after伪元素position:absolute;并将其margin移位。此外，锚点需要display:inline-block;才能正确显示:after内容。请参阅：http://jsfiddle.net/ECFBR/