CSS之 选择器 优先级--css学习笔记

76 阅读1分钟

CSS之 选择器 优先级--css学习笔记

CSS的选择器有哪些

id选择器、class选择器、属性选择器、*、伪类选择器、伪元素、后代选择器、子类选择器、兄弟选择器

优先级是怎样的

优先级:

  • 第一优先级:!important会覆盖页面内任何位置的元素样式

  • 1.内联样式,如style="color: green",权值为1000

  • 2.ID选择器,如#app,权值为0100

  • 3.类、伪类、属性选择器,如.foo, :first-child, div[class="foo"],权值为0010

  • 4.标签、伪元素选择器,如div::first-line,权值为0001

  • 5.通配符、子类选择器、兄弟选择器,如*, >, +,权值为0000

  • 6.继承的样式没有权值

权重计算方式

比较规则

参考资料:面试官:说下CSS选择器优先级 CSS 选择器优先级