CSS为什么在规则之前添加空格？

CSS代码格式化的问题：我有增加空单的老习惯了{启动一个新的CSS规则之前，像这样：CSS为什么在规则之前添加空格？

body { 
    font-size: 16px 
}

这样一个body和{之间的空格整个CSS加起来。

理想的情况下，我宁愿写我的规则，像这样（因此节省空格）：

body{ 
    font-size: 16px 
}

其实，我忘了我为什么这样做呢？

请注意，我故意简化了这里的例子来显示空格。当然，没有必要从文件中删除这里的空间。但是在2-3,000条规则的现实生活中，它可能会加起来。另外，我认为与那个被删除的情况相比，那个位置上的单个空白会严重压缩。

我早就忘记了为什么要添加那些奇怪的空格。移除安全吗？哪个浏览器需要空格？

来源

2009-12-03 Jesper Rønn-Jensen

您可能会添加空间，因为它读取/看起来更好。

安全删除，浏览器不关心这些空间。任何CSS压缩器/优化器将删除所有这些空间，换行符等。

现在很少有人手工优化他们的css，我的建议是让你的css可读和可保留，然后使用压缩器/优化器如YUI 。

http://developer.yahoo.com/yui/compressor/

来源

2009-12-03 22:56:32 rjlopes

感谢您的回答。实际上，我已经在这个项目上直接使用YUI压缩器，并且注意到它删除了特定的空白。 – 2009-12-04 13:15:30

删除它是非常安全的。如果你缩小了你的CSS，那么它将会把它们删除，并且它会减少你的CSS，因为它使用更少的带宽来移动CSS。

来源

2009-12-03 22:50:52 AutomatedTester

安全，也许但不可读。少数备用字节不值得您的代码的可读性和可维护性。 – 2009-12-03 23:02:39

问题是否安全？是的，事物之间的空间不会对可读性产生影响。如果你打算让人们失望，那么就去做一行一行的人吧！ – AutomatedTester 2009-12-03 23:05:51

CSS像大多数编程语言一样跳过任何空格。规则和左括号之间的额外空间使得阅读起来更容易。个人而言body{看起来很丑。

如何在CSS中使用空格由你决定，但它有助于使其可读。

你宁愿这样：

body{ 
text-align:center; 
font-size:10pt; 
}

或那样吗？

body { 
    text-align: center; 
    font-size: 10pt; 
}

来源

2009-12-03 22:51:11

有些人用css节省空间会把规则放在一行上。这样可以节省更多空间，因为您没有新的换行符，并且它仍然非常易读。

body { font-size: 16px; font-weight: bold; }

由于CSS是大多数网站上的缓存，即使2-3000线是不会给你节省大量的空间，并且业绩增长很可能将是微不足道的反正。

编辑：改变了大多数人对一些人。

来源

2009-12-03 22:52:11 Deeksy

你不能指望缓存，但我同意额外的大小可能可以忽略不计。 – Joel 2009-12-03 22:55:04

不知道“大多数人”..从我可以告诉，它的相当分裂。 – 2009-12-03 22:55:52

我同意，“大多数人”都很漂亮。 – Deeksy 2009-12-03 23:27:39

是的，你可以删除空格，实际上如果你真的想保存字节，你也可以删除“font-size：16px”中的空格。

话虽如此，大多数服务器和浏览器gzip网络上的内容无论如何，所以实际节省空间将是最小的，可能不值得在可读性方面的成本。

来源

2009-12-03 22:52:54 Nick

body {

看起来更好看（至少我是这么认为的）。

不要考虑保存几个字节，不管你如何格式化你的代码，你应该在部署它之前通过css compression utility运行它。根据您的开发环境，您可能会自动执行此任务。

你也应该配置你的http服务器使用css的gzip压缩（这会比正文和{）之间的空白多节省很多。

来源

2009-12-03 22:53:04 Kimble

互联网连接快速。杀死你的是延迟时间，有时候是几秒钟，而服务器正在等待你的回复通过网络。实际的文件传输只占用了总时间的一小部分。

鉴于一个体面的服务器设置也会发送gzip的css文件，我认为在考虑到所有其他开销时，我认为它在更大的方案中会有很大的差异。我会坚持任何最好的。

如果CSS文件确实达到了你认为这会产生影响的程度 - 正如另一张海报所说的那样 - 缩小是前进的方向。不要忘记换行符或制表符占用太多空间。

来源

2009-12-03 22:57:09 Meep3D

我真的喜欢第三种选择：

class 
{ 
    ... 
}

我觉得在你有适用于几类，像这样的风格的情况下更具可读性：

classA, 
classB, 
classC 
{ 
    ... 
}

，但当然，最终都是关于个人偏好。以易于阅读，理解和维护的方式编写代码，并使用缩小器/压缩器优化生产环境的性能。

来源

2009-12-03 23:12:19

我最喜欢的格式是像这样：

body{ margin:0; 
     font-family:Verdana, Tahoma, Arial, sans-serif; 
     padding:0;}

它只是似乎愚蠢的我只为最后的“}”字符创建一个新行。它对我来说仍然看起来足够可读，但缺点是没有多少尝试自动格式化CSS的CSS编辑器会这样做。我通常不得不关闭CSS自动格式化或手动将其分开。

来源

2009-12-03 23:33:50 jamauss

，如果你担心不必要空间的CSS文件中的贡献下载大容量的数字，你可能有其他问题，酝酿在其他地方..

个人而言，我总是去可读性在担心这些事情八九不离十。我喜欢空间我自己

来源

2009-12-04 00:03:11

嗯，我个人不会在CSS上使用空白区域，我不觉得很难阅读，这只是一个习惯它的问题！

来源

2009-12-04 03:21:08 Evilalan

CSS为什么在规则之前添加空格？

回答

相关问题