是否可以创建一个从另一个CSS类(或多个)“继承”的CSS类。
例如,假设我们有:
.something { display:inline }
.else { background:red }
我想做的是:
.composite
{
.something;
.else
}
其中“.composite”类将显示为内联,并具有红色背景
是否可以创建一个从另一个CSS类(或多个)“继承”的CSS类。
例如,假设我们有:
.something { display:inline }
.else { background:red }
我想做的是:
.composite
{
.something;
.else
}
其中“.composite”类将显示为内联,并具有红色背景
当前回答
您可以向单个DOM元素添加多个类,例如。
<div class="firstClass secondClass thirdclass fourthclass"></div>
后面的类(或更具体的类)中给出的规则将覆盖。所以这个例子中的第四类占了上风。
继承不是CSS标准的一部分。
其他回答
给定示例的SCSS方式如下:
.something {
display: inline
}
.else {
background: red
}
.composite {
@extend .something;
@extend .else;
}
更多信息,请查看sass基础知识
如果您想要比LESS更强大的文本预处理器,请查看PPWizard:
http://dennisbareis.com/ppwizard.htm
警告:该网站确实很难看,学习曲线很小,但它非常适合通过宏构建CSS和HTML代码。我一直不明白为什么更多的网络程序员不使用它。
如果通过php对.css文件进行预处理,则可以实现所需的效果。...
$something='color:red;'
$else='display:inline;';
echo '.something {'. $something .'}';
echo '.else {'. $something .'}';
echo '.somethingelse {'. $something .$else '}';
...
您可以向单个DOM元素添加多个类,例如。
<div class="firstClass secondClass thirdclass fourthclass"></div>
后面的类(或更具体的类)中给出的规则将覆盖。所以这个例子中的第四类占了上风。
继承不是CSS标准的一部分。
Less和Sass是以有价值的方式扩展CSS语言的CSS预处理器。他们提供的众多改进中只有一项是您正在寻找的选项。Less有一些非常好的答案,我将添加Sass解决方案。
Sass具有扩展选项,允许一个类完全扩展到另一个类。有关扩展的更多信息,请参阅本文