两个同名class执行顺序

<div class="red blue">123</div>
<div class="blue red">123</div>

  .blue {
    color: blue
  }

  .red {
    color: red
  }

两个DIV的颜色分别是？

其实这个跟执行顺序有关：style样式 执行到最后的.red，替换掉前面的.blue类的样式

style样式优先级

CSS 7 种基础的选择器：

• ID 选择器， 如 #id{}

• 类选择器， 如 .class{}

• 属性选择器， 如 a[href="segmentfault.com"]{}

• 伪类选择器， 如 :hover{}

• 伪元素选择器， 如 ::before{}

• 标签选择器， 如 span{}

• 通配选择器， 如 *{}

CSS 优先规则3：优先级关系：内联样式 > ID 选择器 > 类选择器 = 属性选择器 = 伪类选择器 > 标签选择器 = 伪元素选择器>*通配选择器