css - CSS中的继承与OOP中的继承？

Question

有人知道如何在 CSS 中独立于元素结构使用继承的方法或工具吗？例子：

.bg_red {
  background: red; 
}

.bold {
  font-weight: bold;
}

.bg_red_and_bold {
  //this class should inherit all the properties of the above two classes
}

我希望我的意思很清楚......

谢谢

Answer 1

在 CSS 中你无法做到这一点，但由于你也在寻找工具，你可能会研究 CSS 预处理：

• 较少的
• SASS

它们mixin和@extend功能应该可以满足您的需求。

Answer 2

正是因为这个原因，才能向元素添加多个类。

<div class="bg_red bold">The red and bold text</div>

Answer 3

CSS中没有这样的东西。你唯一能做的就是：

.bg_red, .bg_red_and_bold  {
  background: red; 
}

.bold, .bg_red_and_bold  {
  font-weight: bold;
}

Answer 4

CSS 不支持这一点。

考虑使用LESS，它编译成 CSS 并支持 mixins：

.bg_red_and_bold {
   .bg_red();
   .bold();
}

Answer 5

可能不是你想要的，但有聚合：

<div class="bg_red bold"...

div 将“继承”两种样式的特征。