使用外部 CSS 覆盖内联样式

使用包含内联样式的 HTML 标记时，您可能会遇到需要覆盖这些样式的情况使用外部 CSS 的样式。但是，应用常规 CSS 规则可能并不总是按预期工作。

要有效覆盖内联样式，您可以在 CSS 规则中使用 !important 关键字。此关键字为规则添加了更高的优先级，使其即使在存在内联样式时也能生效。

例如，考虑以下 HTML 标记：

 
如果您尝试使用 CSS 规则覆盖 div 元素的内联样式：
div {
    color: blue;
}
内联样式不会被覆盖。为了确保内联样式被覆盖，请使用 !important 关键字：
div {
    color: blue !important;
}
通过向规则添加 !important，您可以赋予它比内联样式更高的优先级。因此，div 元素中的文本现在将呈现为蓝色，即使内联样式显式将颜色设置为红色。