此代码段在Firefox上为红色,在Chrome上为蓝色。谁是对的?
* { background: red; '}
* { background: blue; }

单个(
'
)和双引号("
)也必须在匹配中出现 对,它们之间的字符被解析为字符串。
但如果匹配对中没有出现'
或"
,那么应如何处理语法错误?
答案 0 :(得分:4)
通过阅读4.2 Parsing Errors和所谓的“匹配对规则”构造:
* { background: red; '}
* { background: blue; }
应该读作:
* { background: red; ...<EOF> }
也就是说,'}
将被丢弃之后文件中的所有因为该行中的}
没有匹配{
(因为在看到另一个{
之前,总会有另一个}
,所以在文件末尾隐式关闭之前它不会被关闭。
当然,这真的很复杂,所以我错了......
通过CSS21语法进一步阅读似乎证实了这一点。基本上,这里有两种效果:
'
会导致忽略当前行末尾的所有内容。和,{
将导致文件末尾的所有内容都被解析,就像它仍然是同一块声明的一部分一样。基本上,#1导致结束}
丢失。并且#2可能导致其后的所有内容丢失,因为它无法被解析为带有块的有效声明(因为{..}
嵌套计数总是错误的。)
答案 1 :(得分:1)
虽然Chrome只是忽略了该行而没有抱怨,但Firefox停止处理CSS并进行了警告(这至少适用于Mac OS X Yosemite上的Chrome 41.0.2 ..和FF 36.0.1):
Found unclosed string ''}'. Expected declaration but found ''}'. Skipped to next declaration.
尽管警告显示Skipped to next declaration.
,但FF实际上并不适用于我(在提供的代码之前和之后添加了一些css)。
我认为两者都不是一个非常好的解决方案,因为这些天网络依赖于CSS的大部分,所以浏览器也不应该忽略语法错误,也不应该完全停止处理css。
我知道Safari在问题中没有被提及,我并不是它的忠实粉丝,但这就是它的作用:记录警告,跳过该行并处理文件的其余部分。这就是我所期望的。
只是我的0.02 ..