首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何使用外部CSS覆盖内联样式?

如何使用外部CSS覆盖内联样式?
EN

Stack Overflow用户
提问于 2013-05-29 19:56:11
回答 5查看 174.9K关注 0票数 125

我有使用内联样式的标记,但我没有权限更改此标记。如何仅使用CSS覆盖文档中的内联样式?我不想使用jQuery或JavaScript。

HTML:

<div style="font-size: 18px; color: red;">
    Hello World, How Can I Change The Color To Blue?
</div>

CSS:

div {
   color: blue; 
   /* This Isn't Working */
}
EN

回答 5

Stack Overflow用户

发布于 2013-06-24 19:08:33

除了内联!important样式之外,您可以很容易地覆盖内联样式

所以

<div style="font-size: 18px; color: red;">
    Hello World, How Can I Change The Color To Blue?
</div>

div {
   color: blue !important; 
   /* This will  Work */
}

但是如果你有

<div style="font-size: 18px; color: red !important;">
    Hello World, How Can I Change The Color To Blue?
</div>

div {
   color: blue !important; 
   /* This Isn't Working */
}

现在它将仅为red ..你不能重写它

票数 12
EN

Stack Overflow用户

发布于 2014-08-26 14:37:27

<div style="background: red;">
    The inline styles for this div should make it red.
</div>

div[style] {
   background: yellow !important;
}

以下是更多详细信息的链接:http://css-tricks.com/override-inline-styles-with-css/

票数 6
EN

Stack Overflow用户

发布于 2019-12-26 17:24:07

CSS属性中使用的!important

<div style="color: red;">
    Hello World, How Can I Change The Color To Blue?
</div>
div {
        color: blue !important;
    }
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/16813220

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档