Html 如何向内部id添加新的CSS规则

我不太确定如何命名标题，但基本上我要寻找的是如何将特定CSS样式添加到td标记内的类中，该类覆盖为td标记指定的样式。下面是我的html文件和CSS中的相关部分

.content
{
高度：自动；
填充：0 10px 0；
}
.内容
{
字体：粗体14px Arial，Helvetica，无衬线；
颜色：#6878AB；
文本对齐：左对齐；
填充：5px0px 10px；
}
.内容td
{
字体：12px Arial，Helvetica，无衬线；
颜色：#3f4244；
填充：5px0px 10px；
字体大小：13px；
}
.DisplayRow2
{
颜色：绿色；
}

文本1
文本2

您可以使用以下由特殊性解决的解决方案。在这种情况下，您必须定义一个更具体的CSS规则来覆盖另一个现有规则。更具体的CSS规则的另一种选择是

！重要信息

属性。您可以在此处找到有关此主题的更多信息：

.content{
高度：自动；
填充：0 10px 0；
}
.内容{
字体：粗体14px Arial，Helvetica，无衬线；
颜色：#6878AB；
文本对齐：左对齐；
填充：5px0px 10px；
}
.内容td{
字体：12px Arial，Helvetica，无衬线；
颜色：#3f4244；
填充：5px0px 10px；
字体大小：13px；
}
.content td.display行1{
颜色：蓝色；
}
.content td.display行2{
颜色：黄色；
}

文本1
文本2

添加

！重要信息

第二个td，如下所示：

.content
{
高度：自动；
填充：0 10px 0；
}
.内容
{
字体：粗体14px Arial，Helvetica，无衬线；
颜色：#6878AB；
文本对齐：左对齐；
填充：5px0px 10px；
}
.内容td
{
字体：12px Arial，Helvetica，无衬线；
颜色：#3f4244；
填充：5px0px 10px；
字体大小：13px；
}
.DisplayRow2
{
颜色：绿色！重要；
}

文本1
文本2

使用！重要的

.DisplayRow2
 {
    color:green !important;
 }

---

这将覆盖以前的颜色代码值。

尝试类似的操作

您已经可以在class

.content td

中定义

color

css规则。因此

.DisplayRow2

类css不起作用

在css中添加以下css规则

.DisplayRow2{
    color: green !important;
}

.content
{
高度：自动；
填充：0 10px 0；
}
.内容
{
字体：粗体14px Arial，Helvetica，无衬线；
颜色：#6878AB；
文本对齐：左对齐；
填充：5px0px 10px；
}
.内容td
{
字体：12px Arial，Helvetica，无衬线；
颜色：#3f4244；
填充：5px0px 10px；
字体大小：13px；
}
.DisplayRow2{
颜色：绿色！重要；
}

文本1
文本2

看看这个。 把你的代码改成这个，这个是理想的

td.DisplayRow2 {color:green;}

或者你也可以这样做，尽量减少使用！重要标记，因为它会增加复杂性，使用此标记覆盖css规则不是一个好的做法

.DisplayRow2 {color:green !important;}

---

你可能想解释一下为什么这会起作用（具体和全部）谢谢，这起作用了。我可以发誓我已经试过了，但显然不行，谢谢。从没听说过！重要提示：您不应该使用

！重要信息

，不需要执行此操作时。