从CSS代码存放位置看权重优先级：内嵌样式 > 内部样式表 > 外联样式表。
从样式选择器看权重优先级：important > 内嵌样式 > ID > 类 > 标签 | 伪类 | 属性选择 > 伪元素 > 继承 > 通配符。
CSS权重是由四个数值决定：
第一等：代表内联样式，如: style=””，权值为1000。
第二等：代表ID选择器，如：#content，权值为100。
第三等：代表类、伪类和属性选择器，如.content，：hover，[type="text"]，权值为10。
第四等：代表标签选择器和伪元素选择器，如div p,::before，权值为1。
通配选择符（universal selector）（*）关系选择符（combinators）（+, >, ~, ' ', ||）和 否定伪类（negation pseudo-class）（:not()）对优先级没有影响（但是，在 :not() 内部声明的选择器会影响优先级）。
最后把这些值加起来，再就是当前元素的权重了。
权重算出来了，但是某个元素到底用哪个样式，还有3个规则：
1，如果样式上加有!important标记，那么始终采用这个标记的样式；
2、匹配的内容按照CSS权重排序，权重大的优先；
3，如果权重也一样，按照它在CSS样式表里声明的顺序，后声明的优先。
来源：CSDN
作者：qq416761940
链接：https://blog.csdn.net/qq416761940/article/details/103693379