Answers:
请勿同时使用逗号和逗号。兼容CSS 2.1(不支持CSS3)的用户代理将忽略整个规则:
当用户代理无法解析选择器时(即,它不是有效的CSS 2.1),它必须忽略选择器以及随后的声明块(如果有)。
CSS 2.1为选择器中的逗号(,)赋予了特殊含义。但是,由于不知道逗号是否会在将来的CSS更新中获得其他含义,因此即使选择器的其余部分在CSS 2.1中看起来很合理,如果选择器中的任何地方出现错误,也应忽略整个语句。
http://www.w3.org/TR/CSS2/syndata.html#rule-sets
您可以使用
.foo:after { /*styles*/ }
.foo::after { /*styles*/ }
另一方面,这比必要的更为冗长。现在,您可以使用单冒号表示法。
当前文档引入了::符号,以便在伪类和伪元素之间建立区别。
为了与现有样式表兼容,用户代理还必须接受CSS级别1和2(即:first-line,:first-letter,:before和:after)中引入的伪元素的以前的单冒号表示法。本规范中引入的新伪元素不允许
这种兼容性。
似乎对于CSS2.1中已经存在的伪元素使用(仅)单冒号表示法是安全的,因为UA必须向后兼容。
关于考虑使用一个“冒号”冒号,我绝对不同意@mddw和@FelipeAls。
这种“即使已弃用我也会使用它”的心态正是基于浏览器的技术如此缓慢地前进和前进的原因。
是的,我们希望保持与旧标准的兼容性。面对现实吧,这就是我们被抓到的手。但是,这并不意味着您无视当前的标准,而赞成过时的标准,从而懒惰了自己的发展。
最终目标应该是保持对当前标准的符合性,同时支持尽可能多的旧标准。
如果伪元素:
在CSS2和::
CSS3中使用,则不应使用其中一个。我们应该同时使用两者。
为了完全回答最初提出的问题,以下是在支持CSS最新版本(版本3)的同时保留对版本2的传统支持的最合适方法。
.foo:after {
/* styles */
}
.foo::after {
/* same styles as above. */
}
::
。根据您的方法,个人将开始混合使用伪元素:
和::
对伪元素进行匹配。明确遵守旧标准(暂时可能会得到支持)是一种固有的不良做法,应在合理可能的情况下避免使用。如果您不同意该说法,我们只是持不同观点。
但是,对于新的javascript和CSS都使用polyfill变得越来越流行,因此,只要有必要,您可能只想坚持使用较新的double-colon(::
)语法,并为较旧的浏览器维护一个polyfill。
根据浏览器统计,在过去一年中,IE 8.0在美国的价值下降到不足1%。
在2015年12月,IE 8.0占据了2.92%的市场。在2016年12月,IE 8.0占据了0.77%的市场份额。
以这种下降速度,停止支持旧版本的IE并开始对伪元素使用::并不是最坏的主意。
包括这两种表示法当然更安全,但是我看不到任何浏览器都长时间删除该单一表示法,因此只使用一个即可(这是有效的CSS2)。
我只根据习惯习惯只使用一个冒号表示。