Question

我只有css的基本知识，是否可以将属性从一种样式继承到另一种样式。因此，例如，我可以将我的默认paragrah标记设置中指定的字体大小继承到我的超链接标记中。

我想这样做的原因是为了更容易维护多种样式。

Answer 1

您可以一次为两个元素定义常用样式：

p, a {
    font-size: 1em;
}

然后根据需要使用各自的属性扩展每个属性：

p {
   color: red;
}

a {
   font-weight: bold;
}

请记住：稍后在样式表中定义的样式通常会覆盖之前定义的属性。

额外：如果您还没有，我建议您使用Firebug Firefox扩展程序，以便了解页面上的元素接收的样式以及它们的继承位置。

Answer 2

没有CSS没有任何方法可以继承样式。但是有几种方法可以分享风格。以下是一些例子：

使用多个课程

<p class="first all">Some text</p>
<p class="all">More text</p>
<p class="last all">Yet more text</p>

p.all { font-weight: bold }
p.first { color: red; }
p.last { color: blue; }

在您的样式中使用逗号运算符

<p class="first">Some text</p>
<p class="middle">More text</p>
<p class="last">Yet more text</p>

p.first, p.middle, p.last { font-weight: bold }
p.first { color: red; }
p.last { color: blue; }

使用容器元素

<div class="container">
  <p class="first">Some text</p>
  <p class="middle">More text</p>
  <p class="last">Yet more text</p>
</div>

div p { font-weight: bold }
p.first { color: red; }
p.last { color: blue; }

这些都不是您正在寻找的，但使用这些技术将帮助您将CSS重复保持在最低限度。

如果您愿意使用服务器端代码预处理您的CSS，您可以获得您正在寻找的CSS继承类型。

Answer 3

是

您应该了解CSS中的级联如何工作，并了解继承的工作原理。有些样式会继承（比如字体），有些样式不会（比如边框）。但是，您也可以告诉样式从DOM中的父元素继承。

这里的一些帮助是关于如何指定样式规则的知识。 This site about the CSS Specifity Wars可能有所帮助（注意：此网站目前已关闭，但希望很快就会回来）。

此外，我发现有时候会过载这样的样式：

h1, h2, h3, h4, h5 h6 { font-weight: normal; border: 1px solid #ff0; }
h1 { font-size: 300%; }
... etc ...

Answer 4

CSS将自动从父样式继承。例如，如果您在体型中说所有文字都应该是#EEE而背景应该是#000那么所有文字，无论是div还是span，都将始终为#EEE 。

有很多关于添加继承的讨论，就像你在CSS3中描述的那样，但是那个规范还没有出来，所以现在我们不得不重复一遍。

Answer 5

“...是否可以将属性从一种样式继承到另一种样式。例如，我可以将我的默认paragrah标记设置中指定的字体大小继承到我的超链接标记中。”

链接标记会自动使用段落中的字体，当且仅当它们在段落中时才会使用。如果它们在段落之外（例如在列表中），则它们将不使用相同的字体等。

例如这个css：

* {
margin: 0 10px;
padding:0;
font-size: 1 em;
}
p, a { font-size: 75%; }

将生成大小为.75em的链接和段落。但它会在段落中显示约.56em（.75 * .75）的链接。

除了Jonathan Arkell引用的特异性参考文献外，我还推荐W3Schools的CSS Tutorial。

继承css属性

5 个答案: