2013-03-25 60 views
2

为什么我们不能分组CSS如..分组CSS选择与::选择

p::selection , p::-moz-selection 
{background:transparent;} 

演示:http://jsfiddle.net/l2aelba/MRyVC/1/

为什么我们有个像

选择一个
p::selection  {background:transparent;} 
p::-moz-selection {background:transparent;} 

演示:http://jsfiddle.net/l2aelba/MRyVC/

有人可以扩展这个问题吗?

+0

一些浏览器只是有怪异的实现。全屏幕选择器也是如此。 – alex 2013-03-25 11:41:27

+1

我认为是因为IE不能识别'moz'而其他浏览器也是如此。 – 2013-03-25 11:42:01

+0

Chrome和Firefox都不起作用http://jsfiddle.net/l2aelba/MRyVC/1/ – l2aelba 2013-03-25 11:42:55

回答

6

浏览器是expected放弃整个规则如果选择的任何部分无效:

选择器(另见关于选择部分)包括了一切(但不包括)第一左花括号({)。选择器总是与一个声明块一起。当用户代理无法解析选择器(即它不是有效的CSS 2.1)时,它必须忽略选择器和下面的声明块(如果有的话)。

CSS 2.1为选择器中的逗号(,)提供了特殊含义。但是,由于不知道逗号是否可以在将来更新CSS时获得其他含义,因此如果选择器中的任何位置出现错误,则应忽略整个语句,即使CSS 2.1中的其他选择符看起来合理。

(请注意,只要一个浏览器而言,“有效的CSS 2.1”的真正含义“即理解和浏览器支持的选择”。)

由于非Mozilla浏览器不了解::-moz-selection,他们必须放弃规则。由于Mozilla浏览器不理解::selection,他们也必须放弃规则。这是一个双输的局面(也是前缀难以处理的另一个原因,特别是在选择器中)。

为了记录,我很惊讶这不再适用于Chrome(至少在Windows版本25中,因为我只是测试过)。它曾经顽固地将选择器p::selection, p::-moz-selection解析为p::selection,并应用规则而不是遵循规范,开发人员有理由这样做。我不知道什么改变...

+0

+1为正确的答案。 – Spudley 2013-03-25 11:47:00

+0

好的,谢谢你:D – l2aelba 2013-03-25 11:47:19