【发布时间】：2012-08-04 02:18:43
【问题描述】：
我想通过 z-index* 将 div 悬停在文本后面来突出显示文本。如果包含文本的元素没有背景，它可以正常工作：
但是，如果元素有 background 或 background-color，则它不起作用，因为背景会挡住它后面的 div 的视图：
当然我可以让 div 位于顶部，但这看起来很糟糕，因为它会为文本本身着色：
您可以使用 jsfiddle here 看到这个问题。我的问题是：我怎样才能让div 出现在文本后面，但高于背景？
* 为什么我没有像everyone else 那样使用span？因为有了div，我可以为突出显示从一个词到另一个词的移动设置动画。这也在 jsfiddle 中。
【问题讨论】：
-
该示例在 Chrome 中效果不佳。单击“移动 [方向]”时，高亮 div 会移动，但会留下伪影。
-
如果你用 rgba 让背景有点透明怎么办？
-
@RoddyoftheFrozenPeas 这很奇怪。它在 chrome20/FF14/IE9 中对我来说很好。
-
@sachleen 这样的作品。不幸的是，我无法控制背景颜色是如何完成的。
-
@paleozogt 您将无法在文本及其背景颜色之间定位元素。您可以尝试使用另一个 div 来提供 bg 颜色。然后您可以将元素定位在文本（无 bg）和空白 div（bg）之间。顺便说一句，我也看到了文物。