是否可以在 ie7 中的子跨度前面显示父跨度的边框？答案

【问题标题】：Is it possible to display parent span's border in front of a child span in ie7?是否可以在 ie7 中的子跨度前面显示父跨度的边框？
【发布时间】：2011-06-03 00:19:32
【问题描述】：

我希望阴影出现在文本后面。有谁看到我做错了什么？

.工具提示{ 背景颜色：#ffffe1；位置：绝对；边框样式：实心；边框宽度：薄；边框颜色：#000000； z 指数：25； } .tooltip_shadow{ 背景颜色：#dadbda；位置：绝对；宽度：100%；高度：100%；左：5px；顶部：5px； z 指数：-1； }

【问题讨论】：

我知道这是不可能的！开个玩笑，来吧？

标签： html css internet-explorer-7 tooltip

【解决方案1】：

我不知道你实际上想通过影子来完成什么，但我知道这段 HTML 有很多语法错误。标准化后，我只是在div下得到一个div，所以它有一个灰色的背景。你想完成什么？

这是你要找的吗？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<style type="text/css">
    .tooltip{
        position: absolute;
    }

    .tooltip_shadow{
        background-color: green;
        position: absolute;
        width: 100%;
        height: 100%;
        left: 5px;
        top: 5px;
    }

    .tooltip_content
    {
        background-color:red;
        position:relative;
        border-style:solid;
        border-width: thin;
        border-color: #000000;
    }
</style>

</head>

<body>
    <div style="top: 86px; left: 39px;" id="wvTooltipdiv_1" class="tooltip">
        <div class="tooltip_shadow"></div>
        <div class="tooltip_content">This is a message!</div>
    </div>
</body>
</html>

【讨论】：

它必须是跨度，div 不是可变宽度。不过谢谢！
span 在 FF 和 IE8 中的结果与 div 完全相同。工具提示下方只是一个灰色背景。所以它确实有效？
另外，你发给我的样本，阴影在文字前面。
不，我将 z-index 从 0 编辑到 -1。这实际上在 IE7 中有时是不被接受的。
灰色阴影应该在边框后面。从你的回答中删除 style="top:0;left:0; ，你会发现这个解决方案不太奏效。