Question

我正在研究一些CSS文件，我发现了这个：

{}.foo { color: red }

有人知道为什么{}.在Chrome中有效，即使它的语法不正确？它只是被忽略了，还是意味着什么？我还没有找到有关它的文档。

这是我的例子中的JSFiddle。

＆＃13;

h1 {
  color: #f00;
}

{}.ll {
  color: green;
}

＆＃13;

<h1>Hello world!</h1>

<p class="ll">This is a demo app that shows how to Fiddle with Firefox OS using JSFiddle! Please fork me and make wonderful things</p>

＆＃13;

Answer 1

我不知道为什么它出现在您找到的代码示例中，但它没有做任何有用的事情。

CSS规则之间不需要空格：

.a{color:red}.b{color:blue}.c{color:green}

<div class="a">a</div>
<div class="b">b</div>
<div class="c">c</div>

没有关联选择器的规则（或分隔符）只会被忽略：

.a{color:red}{color:blue}.c{color:green}

<div class="a">a</div>
<div class="b">b</div>
<div class="c">c</div>

将这些放在{}.foo{color:red}中，并且前导{}成为一个空的规则块，不应用于任何元素;解析器继续将.foo{...}视为适用于具有类“foo”的元素的普通CSS。

Answer 2

这只是一个空的声明块。

{}.foo { color: red; }

相当于：

{}

.foo { color: red; }

和此：

{ background-color: green; }

.foo { color: red; }

所有这些都呈现相同：第一个声明什么都不做。 CSS解析器只是忽略它。

4.1.7 Rule sets, declaration blocks, and selectors

选择器由一直到（但不包括）的所有内容组成   第一个左大括号（{）。选择器总是与a一起   声明块。当用户代理无法解析选择器时，它   必须忽略选择器和以下声明块（如果有）   同样。

4.2 Rules for handling parsing errors

在某些情况下，用户代理必须忽略非法样式表的一部分。   此规范定义＆＃34; ignore＆＃34; 表示用户代理正在解析   非法部分（为了找到它的开始和结束），但是   否则就好像它不在那里一样。

什么{}。在CSS Selector之前意味着什么？

2 个答案: