CSS 优先级是指当多个 CSS 规则同时作用于同一个 HTML 元素时，浏览器按照一定的规则来决定使用哪个 CSS 规则。
优先级由四个因素决定：
- !important
- 内联样式（在 HTML 元素上直接使用 style 属性）
- ID 选择器
- 类选择器、属性选择器、伪类选择器
!important 是最高优先级，即使后面有更高优先级的规则也会被覆盖。内联样式的优先级较高，但比 !important 低。
ID 选择器的优先级比一般的选择器要高，但比内联样式和 !important 要低。
类选择器、属性选择器、伪类选择器的优先级相同，按照出现顺序来确定优先级。
如果两个规则的优先级相同，那么浏览器会使用后出现的规则。如果两个规则具有相同的选择器，但出现在不同的样式表中，则浏览器将使用引入样式表的顺序来确定优先级。
除了以上基本规则外，还有一些特殊情况需要注意：
- 继承的属性不会被子元素的规则覆盖，但如果子元素使用内联样式，子元素规则的优先级会高于继承的规则。
- 如果使用 @import 引入的样式表出现在文档头部，那么它的优先级会高于在文档中出现的样式规则。
/* 优先级：类选择器 >ID 选择器 >内联样式 >伪类选择器 */
div.blog-post {
color: blue;
}
#post-title {
color: red;
}标题
正文
/* 上面的样式代码，标题的颜色是绿色的，正文的颜色是蓝色的。 */更多关于 CSS 优先级的详细信息，请查阅 MDN 文档。
本文链接：https://my.lmcjl.com/post/15720.html
展开阅读全文
4 评论