CSS样式继承

Question

让我们说我想定义两种风格。

.color_red { color: Red; }
.banner { display: block; width: 100%; }

有没有办法可以让h1样式继承color_red样式？我不想做

<div class="banner color_red">This is my banner.</div>

我宁愿做这样的事......

.banner { ... inherit: color_red; }
...
<div class="banner">This is my banner.</div>

让横幅有红色文字。

Answer 1

你必须写：

.color_red, .banner { color: Red; }
.banner { display: block; width: 100%; }

Answer 2

不，没有办法直接这样做，最好分享风格定义：

.color_red,
.banner
{
  color: red;
}

但是我想指出你是从错误的方向接近问题。你的加价应该独立于风格，并且应该在理想的发展中引领风格。这意味着定义.color_red是一个严重的问题，因为它没有说明标记的语义，如果你需要设置那个标记蓝色的样式，你会遇到多少问题？ / p>

更好地允许你的加价存在：

<div class="banner highlight">I am a banner AND I am highlighted!</div>

支持：

<style>
.highlight
{
  color: red;
}

.banner
{
  display: block; 
  width: 100%;
}
</style>