什么是 !important？
在 CSS 中，!important 是一个用于提升某条样式规则优先级的声明。
当多个样式规则作用于同一个元素时，带有 !important 的声明会覆盖其他相同或更高优先级的规则（除非另一个也带 !important 且来源更“近”）。
基本语法
.example {
color: red !important;
}在属性值后加上 !important 即可。
使用示例
假设有以下 HTML 和 CSS：
<div class="box">测试文本</div>/* 普通样式 */
.box {
color: blue;
}
/* 后定义但无 !important */
div {
color: green;
}
/* 使用 !important */
.box {
color: red !important;
}最终文字颜色为 红色，因为 !important 覆盖了其他规则。
注意事项
- 尽量避免滥用
!important，它会破坏 CSS 的层叠逻辑，使样式难以维护。 - 如果必须使用，建议在临时调试或覆盖第三方库样式时谨慎使用。
- 两个
!important规则冲突时，仍遵循 CSS 优先级规则（如内联 > ID > 类 > 标签）。
替代方案
与其使用 !important，不如：
- 提高选择器的特异性（specificity），例如使用更具体的选择器。
- 调整 CSS 加载顺序，确保需要的样式后加载。
- 使用 CSS 自定义属性（变量）统一管理样式。