CSS属性的常规顺序
CSS属性的常规顺序
提问于 2011-02-03 03:02:51
对于CSS属性的顺序，有没有标准的指导原则？这将决定我是否应该使用此代码
p {font-size: 14px; color: purple}或者使用下面的代码
p {color: purple; font-size: 14px}编辑
我现在使用的是The CSS Box Model Convention
回答 9
Stack Overflow用户
回答已采纳
发布于 2011-02-03 03:06:14
没有被广泛采用的惯例。这两个示例之间没有区别，因此您应该选择您喜欢的约定。如果你真的要满足地精，选择字母顺序或它影响盒子模型的顺序。
Stack Overflow用户
发布于 2011-09-10 14:51:46
事实上，没有一个得到广泛认可的惯例。我更喜欢编写同心CSS，其中我按照从框的外部到内部的顺序列出属性，这样我就可以记住填充是在边界内还是在边界外，等等。在阅读了你在这里的精彩问题后，我意识到我觉得自己足够强大，可以写一篇博客文章，所以如果你好奇的话，这里有你：
http://rhodesmill.org/brandon/2011/concentric-css/
请注意，在几种情况下，流行的Box Model Convention 的顺序是错误的。实际的CSS呈现是这样的，从外到内：
+-------------------+
| |
| margin |
| |
| +---border----+ |
| | | |
| |(background | |
| | color) | |
| | | |
| | padding | |
| | | |
| | +-------+ | |
| | | height| | |
| | | × | | |
| | | width | | |
| | +-------+ | |
| +-------------+ |
+-------------------+这为你的CSS提供了一个自然的排序方式：
margin / border / background / padding / height × width取而代之的是，“盒子模型约定”使用了这个相当奇怪的顺序：
height × width / margin / padding / border / backgroundStack Overflow用户
发布于 2011-02-03 03:06:37
我不相信属性的顺序会对最终结果有任何影响，除非有两个类似的属性被称为
border:1px solid #000;
border-top:none;对比
border-top:none;
border:1px solid #000;除此之外，任何你觉得最容易阅读的东西都是最好的选择。我按字母顺序列出它们，因为这往往会将相似的属性组合在一起。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/4878655
复制相关文章
相似问题
腾讯云开发者
