CSS 样式继承
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1250973/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS Style Inheritance
提问by Jeremy Edwards
Lets say I want to define 2 styles.
假设我想定义 2 种样式。
.color_red { color: Red; }
.banner { display: block; width: 100%; }
Is there a way that I can have the h1 style inherit the color_red style? I don't want to have to do
有没有办法让 h1 样式继承 color_red 样式？我不想做
<div class="banner color_red">This is my banner.</div>
I'd prefer to do something like this...
我宁愿做这样的事情......
.banner { ... inherit: color_red; }
...
<div class="banner">This is my banner.</div>
And have the banner have red text.
并让横幅有红色文字。
回答by Thinker
You have to write:
你必须写：
.color_red, .banner { color: Red; }
.banner { display: block; width: 100%; }
回答by annakata
No, there is no way to do this directly, better to share style definitions:
不，没有办法直接做到这一点，最好共享样式定义：
.color_red,
.banner
{
color: red;
}
However I'd like to point out that you're approaching the problem from the wrong direction. Your mark-up should be independant of the style and should lead the style in development ideally. This means that defining .color_redis a serious problem, because it says nothing about the semantics of the mark-up and how much of a problem are you faced with if you need to style that bit of mark-up blue?
但是，我想指出您是从错误的方向解决问题的。你的标记应该独立于风格，并且应该在理想的情况下引领风格的发展。这意味着定义.color_red是一个严重的问题，因为它没有说明标记的语义以及如果您需要将标记设置为蓝色样式，您会面临多少问题？
Far better to allow your mark-up to exist like this:
让您的标记像这样存在要好得多：
<div class="banner highlight">I am a banner AND I am highlighted!</div>
supported by:
支持：
<style>
.highlight
{
color: red;
}
.banner
{
display: block;
width: 100%;
}
</style>
