css - z-index 在 IE8 中不起作用。为什么？

Question

我正在尝试使用纯 css 设置组合框的样式，并找到一些教程并创建了组合框。它在 chrome 和 firefox 上运行良好。

请看一下我创建的样式。

http://jsfiddle.net/SnU3d/1

label
{
    position:relative;
    z-index:9999;
}


label:after 
{
    content:'?';
    font:11px "Consolas", monospace;
    color:#009FDF;
    font-size:120%;
    pointer-events:none;
    background: #fff;
    border:1px solid #999;
    width:30px;
    height:24px;
    margin-bottom:2px;
    position:absolute;
    border-left:0px;
    right:-1px;
    z-index:99;
}

我发现了一些关于这个的其他教程。IE7 / IE8 z-index 问题，请在此处输入链接描述。

所以我为父标签设置了更高的zindex值。但是之后的伪元素仍然没有出现在IE8中。为什么 ？如何使之后的内容可见。

Answer 1

:after伪元素创建您应用它的元素的子元素 ( ) Label，并且您分配给父元素 () 的 z-index 值label，无论该值是什么，都会在该元素内创建一个新的堆叠上下文，因此您最终得到label其堆叠上下文的第 9999 层中label:after的父元素label（