是否可以继承css类？

Question

我有两个css类：

magrin{
    margin-top:35px;
    background-color:red; 
}

#MainContent {
    margin: 0 .3em;
    font-size: .8em;     
}

是否可以让#MainContent类继承magrin类？

Answer 1

No

CSS继承是从父元素到子元素，而不是从一个规则集到另一个规则集。

您可以使用分组选择器编写样式，将多个类应用于单个元素，或使用预处理工具（如SASS或LESS）。

在这种情况下，分组选择器（,）可能是最合适的：

#MainContent {
    margin: 0 .3em;
    font-size: .8em;     
}

#MainContent, magrin{
    margin-top:35px;
    background-color:red; 
}

Answer 2

SASS可以进行类继承。您可能想要查看它，如下所示：

.magrin{
    margin-top:35px;
    background-color:red; 
}

.MainContent {
    @extend .magrin;
    margin: 0 .3em;
    font-size: .8em;     
}

在http://sass-lang.com/guide

中了解详情

Answer 3

据我所知，没有这样的事情。但是，您可以通过在规则的开头添加magrin来使.成为一个类，您可以将其添加到ID为MainContent的元素中。 ID必须是唯一的，但元素可以同时具有ID和一个（或几个）类。

Answer 4

您可以在magrin上使用#MainContent个样式

magrin, #MainContent {
    margin-top:35px;
    background-color:red; 
}

#MainContent {
    margin: 0 .3em;
    font-size: .8em;     
}