700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > css样式权重计算规则 CSS 选择器权重计算规则详解

css样式权重计算规则 CSS 选择器权重计算规则详解

时间:2021-04-18 05:52:37

相关推荐

css样式权重计算规则 CSS 选择器权重计算规则详解

CSS有自己的优先级计算公式,而不仅仅是

行间>内部>外部样式

ID>class>元素

一、样式类型

1、行间

我是行间CSS样式。

2、内联

h1{font-size:20px;

color:#123;

}

3、外部

二、选择器类型

ID#id

class.class

标签p

通用*

属性[type="text"]

伪类:hover

伪元素::first-line

子选择器、相邻选择器

三、权重计算规则

1、第一等:代表内联样式,如: style=””,权值为1000。

2、第二等:代表ID选择器,如:#content,权值为0100。

3、第三等:代表类,伪类和属性选择器,如.content,权值为0010。

4、第四等:代表类型选择器和伪元素选择器,如div p,权值为0001。

5、通配符、子选择器、相邻选择器等的。如*、>、+,权值为0000。

6、继承的样式没有权值。

四、比较规则

1,0,0,0 > 0,99,99,99。也就是说从左往右逐个等级比较,前一等级相等才往后比。

无论是行间、内部和外部样式,都是按照这个规则来进行比较。而不是直观的行间&

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。