CSS：同样的规则，属性总是按顺序运行吗？

有很多关于规则优先性的问题和答案。这里的问题是关于浏览器在同一规则内执行CSS属性

直觉上，我一直认为规则的属性是由浏览器按顺序运行的

比如说,

  #somediv {
    margin:0;
    margin-bottom:10px;
  }

呈现为

边距：0 10px 0（并且从不使用
margin:0；
）。这意味着第二个属性
margin-bottom
覆盖上一个
margin
属性（该属性将所有边距设置为
0
）

<>但是，我可以认为这是真的吗？在<强>所有<强>浏览器（即，我在看着你）？
 是的，这是预期的行为，也是CSS的一部分。您只是用一个单独的
边距底部
值覆盖
边距
速记的一个组件

请注意，它不会完全擦除整个
边距
速记声明！请记住，上面的速记可以改写为：

margin: 0 0 0 0;

或者这个：

margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;

因此
marginbottom:10px
将简单地覆盖上面的
marginbottom

还要注意的是，IE6及更早版本不会优先于
！重要信息
同一规则中的声明（但它将在单独的规则中尊重它们）。但是，由于这是一个古老的浏览器，老实说，没有什么值得担心的。这个基本规则已经定义得很好并且没有改变，所以浏览器有足够的时间来正确地实现它，并且没有借口去捏造它，例如包括在内。
是的，如果您声明两个相同的属性，但不同于浏览器的值，那么浏览器将获取该属性最后声明的值

举个例子，如果你用这个

div {
   background-color: #ff0000; /*Red*/
   background-color: #00ff00; /*Green*/
}

浏览器将选择绿色，因为它被声明为最后一个
是。。css属性按在所有浏览器中加载的顺序被覆盖
是的，这是符合以下要求的正确行为：

如果两个声明具有相同的权重。。。后者指定获胜

在您的示例中，
页边距底部
将设置为10px

渲染引擎实际上并不关心相同的Specification属性值来自何处（它们可以像在您的示例中一样在同一规则内设置，也可以在具有相同选择器或不同选择器的两个规则内设置）。如果两个声明具有相同的计算权重，则后一个声明获胜：

<style>
  .container span {color:red;}
  .content span {color:blue;}
  div .inner {color:green;}
  p a {color:orange;}    
</style>
<div class="container">
  <p class="content">
    <a href="#" class="button"><span class="inner">Hello world!</span></a>
  </p>
<div>


.container span{color:red；}
.content span{color:blue；}
内部分区{颜色：绿色；}
PA{颜色：橙色；}



文本将以什么颜色呈现？前三条规则具有相同的特殊性，因此“Hello world！”将以绿色呈现。不过，这在速记属性方面变得更加棘手
 是的，后面写的总是覆盖前面写的
如果您更改了所写行的顺序，您的结果将被还原，第二行将始终领先第一行，因此，如果你有两个或两个以上的css文件，那么你不应该在diff css中的同一个元素上应用sme样式，否则你会得到一些奇怪的css输出，这取决于包含的css文件的顺序。
这是这组特定规则的最正确答案-首先，边距底部将覆盖边距（简写），但是-last规则也会覆盖以前的规则，除非您的选择器比以前的规则更具体。@Jayx看起来是这样的。我更担心的是一些（较旧的）浏览器不遵守该规则…@ring0不必担心，这一直是CSS规则的预期行为。我喜欢这些事情在速记被误解时适得其反（我是一个糟糕的人）。询问您的同事，如果您将
左边距设置为20px，会发生什么情况然后
边距：5px10px 15px紧随其后。看着他们说话嗯。。。上，右，下。。。左边距仍然是20px！扰流器警报：它将是10px。可能是重复的重复？我不同意这个问题，因为这个问题特别强调了浏览器的行为：有没有浏览器不遵守上次获胜规则？既然你接受了答案，我就添加一条评论，你的直觉是对的：在一些罕见的情况下，IE过去是不可靠的。