Question

在this MS compatibility table它说，IE9不支持伪元素::before和::after，但是当我尝试它似乎它...时看到JSBin

我做错了吗？我认为::before和::after是隐藏IE9内容的好工具，事实上，他们没有。

Answer 1

IE8及更高版本支持CSS2伪元素:before和:after以及传统的单冒号表示法。他们并不是CSS3的新手。

另一方面，双冒号表示法是new to CSS3。 IE9 确实支持::before和::after的新表示法，同样适用于CSS1伪元素::first-line和::first-letter。然而，展望未来，没有新的伪元素可以使用单冒号语法，并且浏览器（包括IE）应该支持所有伪元素的双冒号语法。

我不知道为什么该表说IE9不支持新的伪元素语法，因为它确实根据上面链接的各个选择器的文档和您的测试用例。当然，还有这个答案。

Answer 2

IE 9在“标准模式”中支持符号::after和::before（带有两个冒号）。在“怪癖模式”中，它没有。这可以测试，例如如下：

<style>
p::after  {  
  content: "***AFTER***";  
} 
</style>
<p>Hello world

这里忽略了CSS规则，因为IE 9进入怪癖模式。但是如果你在开始时添加以下行，IE 9将进入标准模式，CSS规则生效：

<!doctype html>

在IE 9中常见的是，在quirks mode中，不支持新的CSS功能（大多数功能既不在CSS 2.1中也不在IE旧版中）。在怪癖模式下，IE 9也不支持旧的单冒号符号:after和:before。它支持“IE 8模式”中的（但不是双冒号版本），您可以在“文档模式”菜单中手动选择开发人员工具（F12），也可以使用标记{{1}在文档级别选择}。

Answer 3

引自http://www.w3.org/community/webed/wiki/Advanced_CSS_selectors

CSS3伪元素双冒号语法 请注意新的CSS3 编写伪元素的方法是使用双冒号，例如a :: after { ...}，将它们与伪类区分开来。你可能会看到这个有时在CSS中。然而，CSS3仍然允许单冒号伪元素，为了向后兼容，我们会建议您暂时坚持使用此语法。

IE9是否支持CSS3 ::之前和::之后的伪元素？

3 个答案: