如何将样式同时应用到多个类?

我想要两个不同名称的类在CSS中具有相同的属性。我不想重复代码。

.abc { margin-left: 20 px; } .xyz { margin-left: 20 px; } <类=“abc”> Lorem < / > < class = " xyz " > < / >添加

由于两个类都在做同样的事情，我应该能够将它们合并为一个类。我该怎么做呢?

当前回答

还有一种使用@extend来实现SCSS的方法。

其他回答

不要重复你的CSS

 a.abc, a.xyz{
    margin-left:20px;
 }

 a{
    margin-left:20px;
 }

只需用逗号分隔类名。

.a,.b{
your styles
}

如果你按照下面的方法使用，你的代码会比你写的更有效。您应该添加另一个特性。

.abc, .xyz {
margin-left:20px;
width: 100px;
height: 100px;
}

a.abc, a.xyz {
margin-left:20px;
width: 100px;
height: 100px;
}

a {
margin-left:20px;
width: 100px;
height: 100px;
}

还有一种使用@extend来实现SCSS的方法。

你可以对相同的属性有多个CSS声明，用逗号分隔它们:

.abc, .xyz {
   margin-left: 20px;
}

推荐文章