Question

我准备了一个HTML页面。我只能编辑HTML文件 - 我无法编辑CSS。

在CSS文件中，声明了一种颜色：color: #fff000。我在HTML文件中创建了一个新样式。但是，CSS文件style.css更重要 - 当我在HTML页面中添加新颜色时，style.css颜色会覆盖它。

是否有可能将HTML中的CSS设置为比style.css中声明的颜色更重要，而无需编辑style.css？

Answer 1

内联CSS比style.css规则更重要。也许有人在CSS中添加了！重要但是那会覆盖你的内联CSS。要试一试，请执行以下操作：

<a href="#" style="color: red !important">Link</a>

Answer 2

内联CSS总是需要precedence所以如果你将样式直接放在HTML元素本身上，它应该可以工作：

<div id="title" style="color:white">Title</div>

这是可以接受的，但不是我会做的事。

我建议在HTML标题中制作覆盖样式表。这使样式远离HTML内容，但您必须确保使用!important标记来覆盖特异性。添加!important代码不是100％，因为internal stylesheet take precedence over external style sheets，但可能需要考虑。

因此，在前面的例子中，这看起来像是：

<style>
#title {
    color: white!important;
}
</style>

希望这能帮到你！

Answer 3

可以像这样在html中设置css：

    <html>
    <head>
    <style type="text/css">
    .more-important-style {
    background-color: #352e7e;
    }
    </style>
    </head>
    <body>
    </body>
    </html>

Answer 4

您可以将<style>元素与scoped属性一起使用，如下所示：

<style scoped="scoped" type="text/css">
    //Add rule here
</style>

Answer 5

一般来说，我们可以说所有样式都会按照以下规则“级联”成新的“虚拟”样式表，其中第四个具有最高优先级：

1. Browser default
2. External style sheet
3. Internal style sheet (in the head section)
4. Inline style (inside an HTML element)

HTML中的CSS比style.css更重要

5 个答案: