css样式优先级style＞id＞class＞标签

<style>
  span{
  color: blue;  //蓝色
  }
  #span_1{
  color: green;  //绿色
  }
  .span_c{
  color: yellow;  //黄色
  }
</style>

情况1:span(蓝)、style(红)、id(绿)和class(黄)同时都在场的情况下

<span style="color:red" id="span_1" class="span_c">
内容
</span>

结果显示是红色(style>id>class>标签)

情况2:span(蓝)、id(绿)和class(黄)同时都在场的情况下

<span  id="span_1" class="span_c">
内容
</span>

结果显示是绿色(id>class>标签)

情况3:span(蓝)和class(黄)同时都在场的情况下

<span  class="span_c">
内容
</span>

结果显示是黄色(class>标签)

结论：
优先级顺序 style>id>class>标签