我只有 css 的基本知识,是否可以将属性从一种样式继承到另一种样式。因此,例如,我可以将默认段落标记设置中指定的字体大小继承到我的超链接标记中。
我想这样做的原因是为了更容易维护多种样式。
您可以一次为两个元素定义通用样式,如下所示:
p, a {
font-size: 1em;
}
然后根据需要使用各自的属性扩展每一个:
p {
color: red;
}
a {
font-weight: bold;
}
请记住:稍后在样式表中定义的样式通常会覆盖之前定义的属性。
额外:如果您还没有,我建议您获取Firebug Firefox 扩展,这样您就可以查看页面上的元素正在接收哪些样式以及它们是从哪里继承的。
没有 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 继承类型。
是的。
您应该了解 CSS 中的级联是如何工作的,还应该了解继承是如何工作的。有些样式会继承(如字体),有些样式不会继承(如边框)。但是,您也可以告诉样式从 DOM 中的父元素继承。
这里的一些帮助是有关如何指定样式规则的知识。 这个关于 CSS Specifity Wars 的网站可能会有所帮助(注意:这个网站目前已关闭,但希望它会很快恢复)。
此外,我发现它有时有助于重载这样的样式:
h1, h2, h3, h4, h5 h6 { font-weight: normal; border: 1px solid #ff0; }
h1 { font-size: 300%; }
... etc ...
CSS 会自动继承父样式。例如,如果您在正文中说所有文本都应该是#EEE
,而您的背景应该是#000
所有文本,那么无论是在 div 还是 span 中,都将始终是#EEE
.
已经有很多关于以您在 CSS3 中描述的方式添加继承的讨论,但该规范还没有发布,所以现在我们被困在重复自己很多次。
“......是否可以将属性从一种样式继承到另一种样式。例如,我可以将默认段落标记设置中指定的字体大小继承到我的超链接标记中。”
当且仅当它们在段落中时,链接标签将自动使用段落中的字体。如果它们在段落之外(例如在列表中),它们将不会使用相同的字体等。
例如这个CSS:
* {
margin: 0 10px;
padding:0;
font-size: 1 em;
}
p, a { font-size: 75%; }
将生成大小为 0.75em 的链接和段落。但它会在大约 0.56em (.75 * .75) 处显示段落内的链接。
除了 Jonathan Arkell 引用的具体参考,我推荐 W3Schools 的CSS 教程。