CSS块中未公开的引用

时间:2015-04-23 14:25:23

标签: css syntax language-lawyer

此代码段在Firefox上为红色,在Chrome上为蓝色。谁是对的?



* { background: red; '}
* { background: blue; }




§4.1.6 Blocks说:

  

单个(')和双引号(")也必须在匹配中出现   对,它们之间的字符被解析为字符串。

但如果匹配对中没有出现'",那么应如何处理语法错误?

2 个答案:

答案 0 :(得分:4)

通过阅读4.2 Parsing Errors和所谓的“匹配对规则”构造:

* { background: red; '}
* { background: blue; }

应该读作:

* { background: red; ...<EOF> }

也就是说,'}将被丢弃之后文件中的所有因为该行中的}没有匹配{(因为在看到另一个{之前,总会有另一个},所以在文件末尾隐式关闭之前它不会被关闭。

当然,这真的很复杂,所以我错了......

通过CSS21语法进一步阅读似乎证实了这一点。基本上,这里有两种效果:

  1. 不匹配的'会导致忽略当前行末尾的所有内容。和,
  2. 不匹配的{将导致文件末尾的所有内容都被解析,就像它仍然是同一块声明的一部分一样。
  3. 基本上,#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 ..