12

在这个 MS 兼容性表上，它说， IE9不支持伪元素::before和::after

难道我做错了什么？我认为::before并且::after会是从 IE9 隐藏内容的好工具，而事实上，它们并没有。

4

3 回答 3

27

IE8 及更高版本支持CSS2 伪元素:before和:after，以及传统的单冒号表示法。它们对 CSS3 并不陌生。

另一方面，双冒号表示法对 CSS3 来说是新的。IE9确实支持 and 的这种新符号::before，::after同样也支持 CSS1 伪元素::first-lineand ::first-letter。然而，展望未来，没有新的伪元素可以使用单冒号语法，并且浏览器（包括 IE）预计将支持所有伪元素的双冒号语法。

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

于 2011-08-23T07:10:34.407 回答
5

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

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

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

<!doctype html>

在 IE 9 中很常见的是，在quirks mode中，不支持新的 CSS 功能（大多数既不在 CSS 2.1 中也不在 IE legacy 中的功能）。在 quirks 模式下，IE 9 也不支持旧的单冒号表示 :after法:before。它在“IE 8 模式”中支持它们（但不支持两个冒号版本），您可以在开发人员工具 (F12) 中手动选择，在“文档模式”菜单中，或使用标签在文档级别选择<meta http-equiv="X-UA-Compatible" content="IE=8">。

于 2013-01-03T19:36:53.523 回答
1

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

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

于 2013-06-19T08:01:52.283 回答