停止覆盖以前的CSS属性

Question

例如，给出这两个规则

p { color: red; background: yellow }
p { color: green }

段落将以绿色文字显示。然而，它们也会有黄色背景，因为第一条规则并未完全否定。它的color属性值被第二个规则覆盖，但它的背景颜色没有冲突，所以它仍然适用。

那么无论如何都要停止应用背景颜色属性吗？

我需要这样的方法，因为第一条规则可能有n号。我事先不知道的属性。 期待积极的回复。

Answer 1

这就是你可以在CSS中定义类的原因。

如果存在重复的属性并且从同一元素的先前定义继承，则将始终覆盖为同一元素定义的样式。

尝试：

CSS

p.red { color: red; background: yellow }
p.green { color: green }

HTML

<p class="green">Some text</p>
<p class="red">Another text</p>

Answer 2

为每个＆lt; p＆gt;定义一个类元件。为每个定义的类设置CSS样式。

HTML文件（索引文件）

<p class="content-1">This is content 1</p>
<p class="content-2">This is content 2</p>

CSS文件（style.css）

p.content-1 {
    color: red; background: yellow;
}
p.content-2 {
    color: green;
}

JSFiddle：http://jsfiddle.net/SCLP8/

Answer 3

您可以将背景属性添加到您自己的CSS中，如下所示：

p { color: red; background: yellow; }
p { color: green; background: none; }

不会有黄色背景。