css3，我可以添加其他类到一个类吗？

Question

实施例：

mycssfile1.css：

.a { a:ssss; b:llll;} 

mycssfile2.css：

.b { c:iiii; 
    addclass .a 
} 

作为相同.B {C：IIII;一个：SSSS; B：LLLL;}

Answer 1

正如许多人之前说的，你需要使用一个CSS预处理器来做到这一点。有两个基本相似的概念，它们的核心用法不同，但它们都可以做你所需要的。这两个概念是延伸和进口。

我是Sass最有经验的人，所以我会解释如何在Sass中做到这一点，但在其他预处理器中是如此。

当你导入 CSS，你正在创建一个可重用的代码称为混入当需要时可以被包括在内。例如，写

@mixin red-copy{ 
    font-family: sans-serif; 
    font-size: 14px; 
    color:red; 
} 

h1{ 
    @include red-copy; 
} 
p{ 
    @include red-copy; 
} 

将输出CSS，看起来像：

h1{ 
    font-family: sans-serif; 
    font-size: 14px; 
    color:red; 
} 
p{ 
    font-family: sans-serif; 
    font-size: 14px; 
    color:red; 
} 

您也可以通过这样的变量：

@mixin default-copy($color: red){ 
    font-family: sans-serif; 
    font-size: 14px; 
    color: $color; 
} 

h1{ 
    @include default-copy(blue); 
} 
h2{ 
    @include default-copy(green); 
} 
p{ 
    @include default-copy; 
} 

这将输出到：

h1{ 
    font-family: sans-serif; 
    font-size: 14px; 
    color: blue; 
} 
h2{ 
    font-family: sans-serif; 
    font-size: 14px; 
    color: green; 
} 
p{ 
    font-family: sans-serif; 
    font-size: 14px; 
    color: red; 
} 

扩展略有不同，因为您正在扩展现有的CSS声明。他们是这个样子

.error{ 
    border: 1px solid red; 
    color:red; 
} 
.serious-error{ 
    @extend .error; 
    border-width:5px; 
} 

这将编译为：

.error, .serious-error{ 
    border: 1px solid red; 
    color:red; 
} 
.serious-error{ 
    border-width:5px; 
} 

希望这有助于！

退房萨斯这里：http://sass-lang.com/

退房LESS这里：http://lesscss.org/

退房手写笔的位置：http://learnboost.github.io/stylus/

Answer 2

你不能用原生CSS做到这一点。你正在寻找的是CSS预编译器，如SASS。例如，inspired from the doc：

.a { 
    prop1:val1; 
    prop2:val2; 
} 


.b { 
    @import "a"; 
    prop3:val3; 
} 

Answer 3

你不能只是类用逗号分隔？

.a, .b { 
    font-size: 12px; 
    margin: 10px; 
} 

.b { 
    padding-top: 20px; 
}