1第一等：代表内联样式，如: style=””，权值为1000。
2第二等：代表ID选择器，如：#content，权值为0100。
3第三等：代表类，伪类和属性选择器，如content，权值为0010。
4第四等：代表类型选择器和伪元素选择器，如div p，权值为0001。
5通配符、子选择器、相邻选择器等的。如、>、+,权值为0000。
6继承的样式没有权值。
例外：!important 的作用是提升优先级，换句话说。加了这句的样式的优先级是最高的（比内联样式的优先级还高)。css的权重等级可以分为5个级别：
1第一级别：内联样式，详细大家都知道什么是内联样式，既是在标签添加style属性<div style=""></div>，这种方式权重值最高，权重值为1000，但是开发过程中比较少用到这种，因为现在推荐的方式都是将css，js，html写成单独文件。这样子看起来会比较整洁以及方便管理。
2第二级别：ID选择器，id选择器就是使用"#"开头选择，大家应该都明白，这种选择方式的权重值为0100。
3第三级别：class选择器，class选择器就是使用""开头的选择器，这种选择方式的权重值为0010
4第四级别：标签选择器以及伪类选择器，就是直接使用标签或者伪类选择器，这种两种选择方式的权重值都为0001
5这里提醒一下通用选择器(),子选择器(>)和相邻同胞选择器( )这三种是没有权重的，也就是权重值为0000，虽然没有权重 但是比继承样式权重高；这里值得提醒一下，并非所有的伪类选择器的权重都为i，总一些领导家的孩子，像a:link，a:visited伪类选择器，他们的权重比第三级别class选择器的权重还高。
这里要提醒一下，这里的权重并不是10进制，不过在比比较的时候可以当作十进制去叠加。可以有三种理解方式，如下：
一：层叠性指的是样式的优先级，当产生冲突时以优先级高的为准。
开发者样式>读者样式>浏览器样式（除非使用!important标记 ）
id选择符>（伪）类选择符>元素选择符
权重相同时取后面定义的样式
二：
CSS层叠性是指CSS样式在针对同一元素配置同一属性时，依据层叠规则（权重）来处理冲突，选择应用权重高的CSS选择器所指定的属性，一般也被描述为权重高的覆盖权重低的，因此也称作层叠。每个CSS选择器都会有一个权重，当两个选择器同时配置同一元素的同一属性时（比如一个设置color：red，另一个color：black），就会产生冲突，而解决冲突的方案就是CSS选择器的权重，权重高的来覆盖权重低的。
三：层叠性指的是上级标签的样式会自动继承到其所有下级标签，如针对<body>设置的标签选择器所设的字体样式会自动应用到<body>下的<p>中，除非<p>重写了相关样式将其覆盖。以下是权重的规则：标签的权重为1，class的权重为10，id的权重为100，以下例子是演示各种定义的权重值：
/权重为1/
div{
}
/权重为10/
class1{
}
/权重为100/
#id1{
}
/权重为100+1=101/
#id1 div{
}
/权重为10+1=11/
class1 div{
}
/权重为10+10+1=21/
class1 class2 div{
}
如果权重相同，则最后定义的样式会起作用，但是应该避免这种情况出现
一、CSS层叠性
说明
层叠性是多种CSS样式的叠加，是浏览器处理样式冲突的方式。在HTML中对于同一个元素可以有多个CSS样式存在，当有相同权重的样式存在时，会根据这些样式出现的先后顺序来决定，处于最后面的CSS样式将会覆盖前面的CSS样式。
二、CSS继承性
说明
简单的理解为—“子承父业“，是指子标签会继承父标签的==某些==样式，如文本颜色和字号。想要设置一个可继承的属性，只需将它应用于父元素即可。
三、CSS优先级
在复杂CSS样式表，往往并不是相同样式不同值的堆叠这么简单，经常出现两个或多个不同样式规则应用在同一元素上，这时到底采用哪个样式呢？这就是典型的CSS优先级问题。
处理优先级问题，就是考虑样式权重的高低。这里先给大家介绍一些特殊的情况：
==继承样式的权重为0。==也就是说，在嵌套结构中，无论父元素样式权重多大，子元素继承时，应用在子元素上的权重都为0，即子元素定义的样式会覆盖所有继承来的样式。
==行内样式优先。==应用style属性的元素，其行内样式的权重非常高，可以理解为远大于100。总之，他拥有比上面提高的选择器都大的优先级。
权重相同时，CSS遵循就近原则。也就是说靠近元素的样式具有最大的优先级，或者说排在最后的样式优先级最大。
CSS定义了一个!important命令，该命令被赋予最大的优先级。也就是说不管权重如何以及样式位置的远近，!important都具有最大优先级。
选择器整体分为5大类：基本选择器、层次选择器、伪类选择器、属性选择器、伪对象（伪元素）选择器。
2伪类选择器
（1）内联样式表的优先级别最高；
（2）内部样式表与外部样式表的优先级和书写的顺序有关，后书写的优先级别高；
（3）同在一个样式表中的优先级和书写的顺序也有关，后书写的优先级别高。(被覆盖的只是相同属性的样式)。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）