继承现有的css类

Question

我有一个css类如下：

.sibsi
{
  background-color: #008FFF;
  padding: 5px;
  cursor: pointer;
  color: #ffffff;
}

如何创建一个继承类.sibsi中的所有内容的新类，但是我可以覆盖单个css属性？换句话说，我希望拥有sibsi的所有属性，但只改变背景颜色。

我发现的唯一一件事就是： https://stackoverflow.com/a/5417412/753632

但这实际上意味着在使用类的地方指定所有类。

Answer 1

我建议最初将样式应用于这两个元素：

.sibling, h1 {
  background-color: #008FFF;
  padding: 5px;
  cursor: pointer;
  color: #ffffff;
}

然后明确覆盖另一个元素的背景：

h1 {
  background:black;
}

Example here

Answer 2

在CSS中，您不会继承像面向对象语言中的对象这样的属性。您可能会考虑inherit属性值，该值允许继承某些属性。但是这种继承的工作方式是在一个元素及其父元素（及其父元素及其父元素等等）之间。

每MDN：

  

每个CSS属性定义的摘要都说明了这一点   property默认继承（“Inherited：Yes”）或不继承   默认情况下（“继承：否”）。这可以控制没有值时会发生什么   是为元素上的属性指定的。

在之前的评论中提出了一个很好的观点。如果您希望获得真正的继承，Sass和LESS都会提供extend方法来真正扩展类的样式。

Answer 3

您无法完成使用纯CSS尝试的操作。如果你想要你正在寻找的功能，你应该考虑使用CSS元语言SASS。它有一个名为“@extend”的关键字，我认为它可以实现您的目标。