省略CSS块的最后一个分号

Question

关于这个的几个问题:

我的意思是这样的东西:

#myElement {
  position: absolute;
  top: 0;
  left: 0
}

Answer 1

这是好习惯吗？

手动排除分号是不好的做法.这纯粹是因为在添加更多样式时很容易忽略,特别是如果你在团队中工作:

想象一下,你开始:

.foo {
    background-color: #F00;
    color: #000             <-- missing semi-colon
}

然后有人添加了一些风格:

.foo {
    background-color: #F00;
    color: #000             <-- missing semi-colon
    width: 30px;
    z-index: 100;
}

突然间,另一位开发人员正在浪费时间搞清楚他们的width声明无法正常工作的原因(或者更糟糕的是,并没有注意到它不起作用).离开分号是更安全的

它会大规模地产生更好的加载时间吗？

最明确的是,对于每个块,您可以节省几个字节.这些加起来,特别是对于大型样式表.不要自己担心这些性能提升,最好使用CSS Compressor,例如YUI Compressor来自动删除结束的分号.

它会导致浏览器"破解"吗？

不,这是安全的,因为浏览器正确地实现了规范的这一部分.CSS2规范因此定义了一个声明:

甲声明为空或者包含一个属性名称,后面跟一个冒号的(:),随后的属性值.

更重要的是:

...同一个选择器的多个声明可以组织成分号(;)分隔的组.

这意味着它;用于分隔多个声明,但不需要终止它们.

对于Javascript中的最后一个函数是否也是如此？

JavaScript是一个完全不同规格的完全不同的野兽.Stack Overflow之前已经多次深入回答了这个特殊问题.

Re:"AFAIK,所有浏览器支持在一个块中留下最后一个分号"分号是_delimiters_属性,而不是终结符. (4认同)
请参阅：[规则集、声明块和选择器](http://www.w3.org/TR/CSS21/syndata.html#rule-sets)：“声明块以左花括号 ({) 和以匹配的右花括号 (}) 结尾。中间必须有零个或多个分号分隔 (;) 声明的列表。” (2认同)
奇怪的是，谷歌称它们为 [*声明停止*](http://stackoverflow.com/a/11948884/1081234) (2认同)
@jezzipin，我是根据与具有不同经验水平的各种不同团队合作的经验来解决这个问题的。任何使编写函数式代码变得更容易的事情往往是好的做法，使编写函数式代码变得更加困难的任何事情往往都是不好的做法。 (2认同)

Answer 2

不,省略分号会在您的应用程序中引入大量风险,如果您为元素添加更多样式,将很容易忽略添加它.此时,您依赖于您的手动流程和对细节的关注,以确保您没有意外地错位您的非分号行.更糟糕的是,每次准备好进行制作时,你都必须亲自检查你的css文件,以确保你没有搞砸每个元素中的任何最终样式行.
可能,因为文件会更小,但差异应该可以忽略不计.如果您担心加载时间,在将文件放入服务器之前对其进行Gzipping将为您提供良好的服务.
大多数浏览器足够聪明,可以知道你的意思,但是你仍然不必担心因为不注意最后一种风格而搞砸你的CSS文件.