CSS的层叠性（选择器优先级）

CSS的层叠性（选择器优先级）

CSS中的层叠性主要研究的是当给同一个元素设置了多个样式的时候，应该使用哪个样式？
如下面代码：

CSS有三种引用方式，接下来对比下，这三种方式哪一种优先级会更高？

结论：行内>内部 行内>外部 内部==外部

最后的结论：行内>内部=外部。

对内部的样式做如下比较：

为什么上面显示的是红色呢？下面就引入今天的重点了，我们需要研究下CSS选择器的特殊值。

选择器的特殊值:

• id选择器： 0100 （100元）
• class选择器：0010 (10元)
• 标签选择器： 0001 (1元)

联想记忆法：

可以根据这个联想记忆法，算一下刚才写的选择器，加起来值多少钱，谁钱越多，谁的权利越大，就用谁。

结论：

1. 行内>内部=外部 （就近原则）
2. id > class > p
3. 特殊值（钱）
4. 钱一样多时，使用就近原则
5. !important 可以改变优先级

你可能感兴趣的文章

• css中background和background-color的区别