我知道这可能是一个微不足道的问题,但我在谷歌上找不到任何东西。
CSS中是否有需要有新行的地方?例如,我有以下代码块:
#headertitle {
background: -o-linear-gradient(left, #3fd0e4 0%,#18709f 100%); /* Opera 11.10+ */
background: linear-gradient(to right, #3fd0e4 0%,#18709f 100%); /* W3C */
width:950px;
height:150px;
font-family:rw_SegoePrint_bold,'Segoe Print',OpenSansRegular,Verdana,sans-serif;
font-size:140px;
text-align:center;
position: absolute;
left: 50%;
top: 10px;
margin-left:-475px;
z-index:2;
}
我可以简单地删除新行,最后得到#headertitle{background:-o-linear-gradient(left, #3fd0e4 0%,#18709f 100%);background: linear-gradient(to right, #3fd0e4 0%,#18709f 100%);width:950px;height:150px;font-family:rw_SegoePrint_bold,'Segoe Print',OpenSansRegular,Verdana,sans-serif;font-size:140px;text-align:center;position:absolute;left:50%;top:10px;margin-left:-475px;z-index:2;}
,它仍然可以完美地解析,正如我所期望的那样。然而,CSS编码中是否有任何实例明确需要出现新行?或者我可以用""
(使用PHP)替换"'n"
吗?
任何一种方式都是正确的。前者更适合用于开发目的,因为它可读。后者更适合用于生产目的,因为它会导致更小的文件大小,尤其是如果您删除了所有不必要的空间。
您完全正确,不需要注释或换行符。只要在属性末尾使用;
即可。
请查看PHP Minify,在那里你可以拥有完整的CSS、JS和HTML,并带有换行符,或者你希望它们可读。与用PHP minify缩小它们相比,这可以删除换行符、注释和客户端不需要的一切!如果需要,您甚至可以将文件与组组合。
否,不需要换行符。
这是一篇关于减少代码大小的文章:10个小CSS文件的提示
我知道有大约20个答案,但我想添加我格式化css的方式。
body { background: green; }
ul { margin: 0 50px 0 0; }
ul li { list-style-type: circle; }
这最小化了换行符,但保持了代码的可读性。另外,我花在寻找选择器上的时间比花在寻找属性上的时间要多。
请允许我在此讨论中再添加一个建议。如今,使用css预编译器变得越来越普遍。就我个人而言,我使用的是LESS,但也有其他好的,比如SASS。
优点是您可以更快地编写和更新代码,因为您可以使用嵌套、变量、合并文件甚至基本函数(在LESS中称为mixin)。
完成开发后,可以将.less
文件编译为标准的.css
文件。您可以在服务器上通过javascript在客户端即时执行此操作,但我更喜欢在将文件上传到服务器之前对其进行编译(性能更好)。有很多优秀的编译器,其中大多数都提供了选项来缩小css(从而删除所有空白、换行符和注释)。
就我个人而言,我使用Codekit作为我的编译器(仅限MAC),这非常值得,只需支付少量许可费。它还有很多其他很棒的功能,比如缩小和验证Javascript,优化图像,甚至实时css注入(不需要刷新页面),这在开发过程中非常棒。它会持续监控您的项目,并在更改时自动编译。
一开始它可能看起来有点挑战性,但LESS实际上并没有那么难(与标准css非常相似),一旦你习惯了它,你就离不开它了。真是节省时间!