类选择器样式，这个为什么是蓝色，哪个大佬解释下?

Question

<span class="a2 a3 a1">展示的内容</span>

<style>
    .a1{
        color: red;
    }
    .a2{
        color: green;
    }
    .a3{
        color: blue;
    }
</style>

Answer 1

因为设置为蓝色的a3类在最下面, CSS 全称层叠样式表, 也就是说同样的样式同样的优先级哪个后出现就会覆盖前面的, 优先级高的会覆盖优先级低的

• 第一优先级：无条件优先的属性只需要在属性后面使用！important。它会覆盖页面内任何位置定义的元素样式。ie6不支持该属性。
• 第二优先级：在html标签中给元素标签加style，即内联样式。该方法会造成css难以管理，所以不推荐使用。
• 第三优先级：由一个或多个id选择器来定义。例如，#id{margin:0;}会覆盖.classname{margin:3pxl}
• 第四优先级：由一个或多个类选择器、属性选择器、伪类选择器定义。如.classname{margin:3px}会覆盖div{margin:6px;}
• 第五优先级：由一个或多个类型选择器定义。如div{marigin:6px;}覆盖*{margin:10px；}

• 第六优先级：通配选择器，如*{marigin:6px;}

  不是在标签里面写的顺序哦是在<style>里面的顺序, 如果你把a2类放在最下面就会是绿色了:
  
  

Answer 2

在选择器优先级相同的情况下，规则按照后来居上，后面的覆盖前面的。

Answer 3

css的执行顺序 也是从上到下 你一个标签起了三个类名 当然是展示最后一个赋值的颜色