css样式优先级详解

很多人在写代码的过程中会出现css样式冲突的情况，那么我们怎样才能应用我们想用的样式，下面就个人经验写了一点总结！

 

1.权值（浏览器是根据权值来判断使用哪种css样式的，哪种样式权值高就使用哪种样式）

①标签的权值是 1;

②类（class）选择器的权值是 10 ;

③id选择器的权值是 100 ;

④伪元素（:first-child）权值是 1 ;

⑤伪类（:link）权值是 10;

示例如下:

2.当两个样式权值相等时，就要通过就近原则比较（与被设置的元素越近优先级越高）

        内嵌样式（标签内部）> 内部样式表（当前html中）> 链入外部样式表（html之外）

3.当多层继承样式发生冲突的时候，距离被设置元素最近的父级优先。

 

 

PS:新手初学习，若有错误或者漏缺，望指出，谢谢！！！