关于css权值的问题

Posted 2020-07-29

最近迷上html5，看了一些相关学习资料，现在把css中常见易出错易混淆的知识总结一下：

首先说一下关于css样式继承，重叠和特殊性：

有的时候我们会为同一个元素设置不同的css样式代码，那么元素会启用哪一个css样式呢？

浏览器是根据权值来判断使用哪种样式的，权值越高，就使用哪种样式。

下面是权值的规则：

标签的权值为1，类选择符的权值为10，ID选择符的权值最高为100

1.特殊性

还有一个权值比较特殊----继承也有权值但是很低，有的文献提出它只有0.1，所以可以理解继承的权限最低。

2.层叠

 但是如果html引用的多个css样式具有相同的权值该会用哪一个样式呢？下面就来说说层叠这个问题。

当有相同权重的样式存在时，浏览器会根据这些css样式的前后顺序来决定，处于最后面的css样式将会被应用，这就不难理解了：

内联样式表（标签内部）>嵌入样式表（当前文件中）>外部样式表（外部文件中）

3.重要性

我们在做网页代码时，有些特殊的情况需要为某些样式设置最高权值怎么办？这时我们可以使用！important来解决！

这里需要注意的是当网页制作着不设置css样式时，浏览器会按照自己的一套样式来显示网页，并且用户可以在浏览器中设置自己习惯的样式，比如有的用户习惯把字号设置的大一些，使其查看网页的文本更加清楚，这时注意样式的优先级为：浏览器默认的样式<网页制作者的样式<用户自己设置的样式，但记住！important优先级是个例外，权值高于用户自己设置的样式。

待续...