html - 如何使用外部文件覆盖内联 CSS 规则？

Question

如何使用外部样式表文件覆盖内联 CSS 规则？

这是我的 HTML 代码：

<div class="mydiv" style="background:#000"> lorem ipsom</div>

我想使用 CSS 更改背景颜色。这是我的 CSS 代码：

.mydiv {background:#f00; color: #000;}

但这不起作用，但我这是可能的。

有没有办法更改 Internet Explorer 中的背景颜色？

score 6 · Accepted Answer

内联样式被视为比任何规则集具有更高的特异性。

覆盖它的唯一方法是在元素上更改它或使用!important规则。

!important规则是解决方案的大锤，只能工作一次（如果你想再次覆盖，你会被卡住；没有双重 !important 规则之类的东西），因此更改样式属性值（最好完全删除它以支持样式表）是最好的选择。

如果你真的想使用，!important那么语法是：

.mydiv {
    background:#f00 !important;
    color: #000;
}

score 6 · Accepted Answer

这很简单。!important在您的规则样式之后使用。这是示例：

.mydiv {background:#f00 !important; color: #000;}

score 1 · Accepted Answer

!important为此使用。它将覆盖其他 CSS。试试下面的代码：

.mydiv {background:#f00 !important; color: #000;}

score 0 · Accepted Answer

用这个：

.mydiv {
     background: #f00 !important;
     /* This will increase the rule score */
     color: #000;
}

score -1 · Accepted Answer

您可以使用 CSS 属性选择器：

 <style>
     div[style] {
        background: blue !important;
     }
 </style>

 <div style="background: red;">
     The inline styles.
 </div>

5 回答 5