css优先级及其对应的权重

1.选择器的优先级

  !important>内联选择器(style)>id选择器>类选择器 | 属性选择器 | 伪类选择器 > 元素选择器>通配符(*)

2.选择器的权重(通过权重计算可以避免许多问题)

!important 10000
内联选择器 1000
id选择器 100
类选择器 10
元素选择器 1

  eg:body #sum{width:100px;} 结果:100+1=101。

  ps:!important在某些时候会失效(当然能不用!imortant就不要用)

     eg:box{

        width:100px!important;

        min-width:200px;    

      }

  这个时候!important会失效,最终的宽度会是200px。

猜你喜欢

转载自www.cnblogs.com/angle-xiu/p/11261627.html