html - 绝对位置后文本装饰下划线不起作用

Question

http://jsfiddle.net/ZPNxh/2/

当我绝对定位覆盖层时，h3 上的悬停（下划线）不起作用（尽管 A 标签包裹了所有内容）。

当它正常定位时，下划线就像一个魅力。

我尝试使用 z-indexes，但徒劳无功

有任何想法吗 ？

Answer 1

首先，a标签是内联元素，h3标签是块元素！您不能将h3标签放在标签内a。因此，首先删除a标签并将其作为其他块级元素，如div.

伪类在IE 6 上除了 for标记:hover之外不起作用。a因此，如果您使用div标签并将其定位为div:hover，那么它适用于所有浏览器，除了那些低于 IE 7 的浏览器。

不过，如果您想使用相同的标记，请添加：

a {display: block;}

因此，它将它呈现为一个块元素，而不是内联元素，持有h3and div！

预习

另一种最好的方法是添加border-bottom: 2px solid;而不是text-decoration！