关注程序员耳东，编程转码真轻松
今天聊聊CSS选择器的优先级，这个问题其实很经典，并且很实用
比如说你在接手老项目或者是你使用了开源的UI库、组件库等等，会发现有的样式你怎么覆盖不了呢，这个时候可能就是你对CSS选择器优先级的知识了解不清楚，导致你写的样式没办法覆盖原有的样式，只有你的样式优先级大于别人的样式，你的样式才会生效
根据样式写的位置：
我们都知道，CSS样式代码有3个位置可以写，分别是：
- 内联级别的样式：
- 文档级别的样式：
- 外部link级别的样式：或@import引入
根据选择器的类型：
ID选择器、class选择器、标签选择器、属性选择器、通用选择器、伪类选择器、伪元素、后代选择器、子选择器
优先级
比较规则就是根据加起来的权重，谁权重高就使用谁的样式
如果两个样式权重一样，那就看谁在后面，后出现的会覆盖前面的
- 最高的样式优先级：!important可以覆盖页面中任何样式
- 内联级别的样式：权重是1000
- ID选择器：权重是100
- 类、伪类、属性选择器：权重是10
- 标签、伪元素选择器：权重是1
- 通用选择器、子选择器、后代选择器：权重是0
- 继承的样式没有权重值
