Extending CSS classes

Question

是否有可能仅使用css扩展现有类？

.darkStyle {
       color:#eee;
       background:#222;
 }
.element {
       // here I want to get all properties from darkStyle
       min-width:100px;
       display:block;
}

我知道我可以在HTML class="darkStyle元素"中使用，但任何像我的例子中那样的扩展方法都会更有用。

Answer 1

为此使用Less或Sass。

减少：

.element {
   .darkStyle; // Will output all styles from .darkStyle;
   min-width:100px;
   display:block;
}

Answer 2

首先分配公共属性，然后为.element分配唯一属性。这将是仅使用CSS的唯一方法。您可以使用Less等CSS框架来添加继承等功能。

.darkStyle, .element {
    color:#eee;
    background:#222;
}
.element {
   min-width:100px;
   display:block;
}

Answer 3

不，您不能"扩展"类。你不需要，CSS不是一种编程OO语言，它有不同的机制。

例如，类可以组合在给定的HTML元素上：

<p class="darkStyle">
  I'm styled by styles applying to .darkStyle
</p>
<p class="darkStyle element">
  I'm styled by styles applying to both .darkStyle and .element
</p>

多级别！