Ori*_*iol 18 css notation css-selectors css3 pseudo-element
来自MDN:
::
在CSS 3中引入了该符号,以便在伪类和伪元素之间建立区分.浏览器也接受:
CSS 2中引入的符号.
如果:
CSS3浏览器始终接受表示法,我应该使用它,因为它适用于新旧浏览器吗?
或者我应该同时使用它们,:
旧浏览器和::
新浏览器,因为符号:
不会一直被接受?
注意:我认为我的问题不是重复不是重复我应该对伪元素使用单冒号还是双冒号?因为另一个问题是关于ALL伪元素的单符号和双符号; 虽然我的问题只是关于CSS2中定义的伪元素,而不是CSS3中定义的新元素,因为我已经知道我必须使用的那些::
.
Bol*_*ock 18
为了它的价值,Selectors 4现在明确指示1位作者对所有伪元素使用双冒号,包括CSS1和CSS2伪元素,向前(强调我的):
因为CSS级别1和CSS 2级混为一谈伪元素和伪类通过共享两个单冒号语法,用户代理也必须接受前一个冒号符号为1级和2伪元素(
::before
,::after
,::first-line
,和::first-letter
).此兼容性表示法不允许任何其他伪元素.但是,由于不推荐使用此语法,因此作者应对这些伪元素使用Level 3+双冒号语法.
这意味着今天唯一合适的单冒号语法是你绝对需要传统浏览器支持 - 这里唯一重要的浏览器是IE8及更早版本.如果不这样做,则应使用双冒号语法,以便与只接受双冒号的较新伪元素保持一致.此外,这是相当没有意义的使用单冒号语法如果,例如,你要的是不被支持IE8属性适用无论如何,如border-radius
或box-shadow
,你::before
和::after
伪元素.
我想相信选择器3至少在其声明中暗示这一点,单冒号语法不适用于任何新的伪元素,但是用黑白说明这种事情从来没有伤害过任何人,而且它是很高兴知道即将推出的标准就是这样做的.
此外,绝对没有理由在同一样式表(例如:before, :after { ... } ::before, ::after { ... }
)中使用两种符号编写重复规则,因为现有的浏览器不支持新语法而不支持旧语法.
1 我完全清楚地知道它可能在提出这个问题的时候还没有说明这一点 - 2013年5月的WD肯定没有.
正如我之前在评论中提到的 - http://css-tricks.com/html5-progress-element/#comment-533395
\n\n简短回答\xe2\x80\x93 使用单冒号表示法:
长答案\xe2\x80\x93 \xe2\x80\x99s 和 之间:before
或::before
和:after
之间没有真正的区别::after
。但由于较旧的浏览器使用单个冒号表示法,因此使用:
始终是更安全的选择。阅读W3C 关于伪元素定义的规范,其中指出:
\n\n当前文档引入这个 :: 符号是为了区分伪类和伪元素。为了与现有样式表兼容,用户代理还必须接受 CSS 级别 1 和 2 中引入的伪元素的先前单冒号表示法(即::first-line、:first-letter、:before 和 :after)。CSS level 3 中引入的新伪元素不允许这种兼容性。
\n