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

就是你要找的。

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

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

不要重复你的CSS

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

OR

 a{
    margin-left:20px;
 }

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

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

OR

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

OR

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

只需用逗号分隔类名。

.a,.b{
your styles
}

如果你之前和他们的父母设置过这些类，你应该和他们的父母设置一次(每次重复)，如下所示:

parent .abc, parent .xyz

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

使用CSS伪类:is(之前为:any和:matches)和:where，您可以使用逗号来匹配任何级别上的多个类。

在根级别，:是(。Abc， .xyz)和。Abc， .xyz功能几乎相同。然而，:is只允许匹配选择器的一部分，而不需要多次复制整个选择器。

例如，如果你想匹配.root .abc .child和.root .xyz .child，你可以这样写代码:

.root:是。Abc， .xyz) .child { margin-left: 20 px; ｝ < div class = "根" > <类=“abc”> < span class = "孩子" > Lorem < / span > < / > < class = " xyz " > < span class = "孩子" > < / span >添加 < / > < / div >

:is和:where之间的区别是:where在计算选择器的特异性时被忽略:

.root的特异性:is(。Abc， .xyz) .child = .root .abc .child的特异性 .root的特异性:其中(。Abc， .xyz) .child = .root .child的特异性

这两个伪类都接受一个宽容的选择器列表，这意味着如果一个选择器解析失败(由于不支持的语法，要么太新，要么太旧，要么不正确)，其他选择器仍然可以工作。这使得:即使在根级别也很有用，因为它允许使用现代CSS特性组合选择器，而不用担心一个选择器会破坏其他选择器。

附注:这个问题回答了这个问题的一个更困难的变化，但是谷歌在太多的查询时返回这个页面，所以我认为这个信息在这里是相关的。