当对同一个 css 属性使用多个类时的 css

Question

我不太了解css规则。我有多个具有相同属性（例如“宽度”）的类。
当将这些类设置为 Html 标签时，谁的 width 属性设置为该标签？
例如。

.main{
   width:600px;
   border:1px solid #000;
}

.rule1{
  width:400px;
  min-height:10px;
}

.rule2{
  width:300px;
  background:#aaa;
}

<div class="main rule1 rule2">
  Which rule's width property is set?
</div>

Answer 1

.rule2{
  width:300px;
  background:#aaa;
}

这定义了标签的宽度，因为它位于末尾。当一个标签有多个类，并且它们都有一个共同的样式时，最后一个规则总是会覆盖所有以前的规则。