|
css的选取器有非常多种，那样，自然而然的就会有优先级这一概念显现，因此，css选取器优先级次序是怎么样的呢？本篇文案将来给大众介绍css选取器优先级的排序，话不多说，咱们来直接看正文内容。
在看css选取器优先级次序前，咱们先来简单说说css基本选取器有那些？
1、标记选取器（如：body,div,p,ul,li）
2、id选取器（如：id="name",id="name_txt"）
3、类选取器（如：id="name",id="name_txt"）
4、后代选取器（如：#head .nav ul li 从父集到子孙集的选取器）
5、子元素选取器（如：div>p ,带大于号>）
6、伪类选取器（如：便是链接样式,a元素的伪类，4种区别的状态：link、visited、active、hover。） 看完了基本的css选取器类型后，咱们接着来看一下css优先级的概念。当两个规则都功效到了同一个html元素上时，倘若定义的属性有冲突，那样应该用谁的值的，用到谁的值谁的优先级就高。咱们来看一下css选取器优先级的算法：
每一个规则对应一个初始"四位数"：0、0、0、0
若是 行内选取符，则加1、0、0、0
若是 ID选取符，则加0、1、0、0
若是 类选取符/伪类选取符，则分别加0、0、1、0
若是 元素选取符，则分别加0、0、0、1 算法：将每条规则中，选取符对应的数相加后得到的”四位数“，从左到右进行比较，大的优先级越高。 看完了以上内容，那咱们就来瞧瞧css选取器优先级的详细排序。
css选取器优先级最高到最低次序为：
1.id选取器（#myid）
2.类选取器（.myclassname）
3.标签选取器（div,h1,p）
4.子选取器（ul < li）
5.后代选取器（li a）
6.伪类选取（a:hover,li:nth-child）
最后，必须重视的是：
!important的优先级是最高的，但显现冲突时则需比较”四位数“;
优先级相同期，则采用就近原则，选取最后显现的样式; 继承得来的属性，其优先级最低。以上便是本篇文案的所有内容，关于css选取器当然不止以上的六个选取器，更加多css选取器的内容能够参考css运用手册。
以上便是css选取器优先级次序是什么？css基本选取器优先级的介绍的仔细内容，更加多请关注我！！！！
| 
发表于 2024-6-30 06:27:46
