web-dev-qa-db-ja.com

スタイルを複数のクラスに一度に適用するにはどうすればよいですか?

名前が異なる2つのクラスにCSSで同じプロパティを持たせたい。コードを繰り返したくありません。

.abc {
   margin-left:20px;
}  
.xyz {
   margin-left:20px;
}
<a class="abc">Lorem</a>
<a class="xyz">Ipsum</a>

両方のクラスが同じことをしているので、私はそれを1つにマージできるはずです。どうやってやるの?

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

あなたが探しているものです。

426
Juraj Blahunka

コンマで区切ることにより、同じプロパティに対して複数のCSS宣言を作成できます。

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

CSSを繰り返さないでください

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

OR

 a{
    margin-left:20px;
 }
15
Nitekurs

次のように使用すると、コードは記述したよりも効果的です。別の機能を追加する必要があります。

.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;
}