Html 如何覆盖页面主体中CSS类的样式信息？

所以我正在做一个项目，它接受HTMLs作为输入，并将它们作为输出返回。我作为输入得到的所有HTMLs的文本都在div和样式表中，这些样式表根据class属性为每个div指定样式

为了更好地可视化事物，并了解我的项目进展如何，我希望将输入的HTMLs颜色编码输出到我给出的规范中。对我来说，修改HTML的主体非常容易，但处理样式表却很困难。我要找的只是一些简单的方法来覆盖样式表的颜色属性。它可能有黑客行为，因为这只是临时使用的内部代码。我只想要一些简单有效的东西。有没有一种简单的方法可以覆盖文件体中CSS类的各个方面

[编辑]我想提供一个例子来更好地解释我在寻找什么。我页面顶部的样式表示例（我希望覆盖）如下：

.style21{垂直对齐：顶部；字体大小：13px；字体系列：Helvetica；颜色：#000000；}

我想更改其颜色的div示例如下：

与

---

我的问题是我不能覆盖css中指定的颜色。正如您在上面的示例中所看到的，我试图在div中使用特定的样式来实现它，但这不起作用。[/EDIT]

您可以通过内联编写CSS来测试颜色，就像

..

您可以将CSS放在HTML文件的

头中，它将优先于包含样式表中的类

<style>
.thing{
    color: #f00;
}
</style>


.事情{
颜色：#f00；
}
您是否尝试过使用！风格上的重要旗帜！“重要信息”允许您决定哪种样式将获胜。还请注意！重要提示也将覆盖内联样式

#example p {
    color: blue !important;
}
...
#example p {
    color: red;
}

还有几点建议：

在当前范围内添加范围。内心最深处的人会赢。虽然这可能会变得很难看

<span class="style21">
<span style="position:absolute;top:432px;left:422px; color:Red" >relating to</span>
</span>


关于

jQuery也是一个选项。jQuery库将在目标元素中注入style属性

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript" ></script>
    <script type="text/javascript">

        $(document).ready(function() {
            $("span").css("color", "#ff0000");
        });

    </script>


$（文档）.ready（函数（）{
$（“span”）.css（“颜色”，“#ff0000”）；
});

希望这有帮助。CSS有时会非常令人沮丧。
如果您可以访问头部添加

/*…某种风格*/

侯赛因向你展示的方式

和超级黑客


在html中，它可以工作，但它很难看。
或者，如果您可以在您的案例中使用它，那么最好使用javascript，或者使用style属性在div中添加CSS内联，例如：

<div style="color:red"> ... </div>

。。。

。。。或者创建您自己的样式表并在现有样式表之后引用它，那么您的样式表应该优先

。。。或者使用所需的CSS在HTML的
中添加
元素，这将优先于外部样式表

<style>
.thing{
    color: #f00;
}
</style>

您还可以添加
！重要信息
在样式值之后，覆盖同一元素上的其他样式

更新

使用我上面的一个建议，以类style21的跨度为目标，而不是包含的div。您在包含的div上应用的样式不会被跨度继承，因为它的颜色在样式表中设置。
Eli，
<style>
.thing{
    color: #f00;
}
</style>

重要的是要记住，在css中，特定性有很长的路要走。如果您的内联css正在使用！重要信息，并且没有覆盖导入的样式表规则，然后使用firefox的“firebug”等工具仔细观察代码。它将向您显示应用于元素的css。如果出现语法错误，firebug将在警告面板中向您显示它已抛出声明

还要记住，通常id比类比元素更具体

希望有帮助

-里克

Id在类名之前
标记属性“style=”位于CSS选择器之前
！重要信息
word位于前两条规则之前
更具体的CSS选择器优先于不太具体的CSS选择器。
将采用更具体的方法

例如：


.divclass.spanclass
比
.spanclass
.divclass.divclass
比
.divclass
#divId.spanclass
具有ID，这就是为什么它比
.divClass.spanclass
具有属性和节拍
#someDiv{color:blue}
style:
#someDiv{color:blue！important}
将应用于属性
style=“color:red”
谢谢你的建议。这是我最初尝试的，但它似乎没有覆盖css，这就是我在这里发布的原因。还有其他想法吗？@eli，你接受的答案是我首先给出的答案。发生了什么事。@Hussein，我猜是因为我回答了他的问题；-）@格雷厄姆，我理解，你甚至复制了我在div中的点。@eli甚至没有给我零钱，让我检查他的评论，并回答他关于添加的问题！重要标签。这个答案应该得到检验。格雷厄姆，我无意冒犯你。你能把样式放在你想要覆盖的元素里面，而不是放在另一个元素里面吗？我刚刚重新创建了上面的示例和！“重要信息”不起作用，但将样式直接添加到span标记会起作用。我从来没有想过这也会影响到风格顺序的应用！