IE不着色:之前作为table-cell,为什么?

Fab*_*tti 8 html css internet-explorer pseudo-element

<!DOCTYPE html>
<html>
    <head>
        <style>
        div:before {
            display: table-cell;
            content: "ABC";
            color: red;
        }
        </style>
    </head>
    <body>
        <div>123</div>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

我希望这会呈现出类似的东西 预期,但我明白了 实际 相反,只有在Internet Explorer(任何版本)上运行时.

这是一个错误还是我做错了什么?

Juk*_*ela 4

这似乎是 IE 中的一个错误。如果您在 IE 11 开发人员工具中检查该元素,您会看到伪元素的所有声明都:before被删除(例如,font如果您添加它们,则还包括设置),但displaycontent设置会影响渲染。

为了规避这个错误,在这个简单的情况下按照@BeatAlex的建议进行设置就足够了display: block。在更复杂的情况下,您可能需要更复杂的解决方法。