CSS：一个属性多类

Question

我有以下几点：

.category-2 .content aside {margin-top: 4px;} 
.category-3 .content aside {margin-top: 4px;} 
.category-4 .content aside {margin-top: 4px;} 

如何使用一个边距为所有三个类别？

Answer 1

使用“”字符为您的属性共享给多个选择：

.category-2 .content aside, 
.category-3 .content aside, 
.category-4 .content aside 
{ 
    margin-top: 4px; 
} 

格式化CSS的这种方式被称为逗号分隔选择，作为@Aaron建议。

Answer 2

你可以使用：

div[class^="category"] { margin-top: 4px; } 

Answer 3

要么你写成这样

.category-2 .content aside,.category-3 .content aside,.category-4 .content aside {margin-top: 4px;}

，或者依赖于HTML结构的其余部分如

#category aside { margin-top:4px;}

<div id ="category"> 
 
    <div class="category-2"> 
 
    <div class="content"> 
 
     <aside> 
 
     <p>blabla</p> 
 
     </aside> 
 
     </div> 
 
    </div> 
 
    <div class="category-3"> 
 
    <div class="content"> 
 
     <aside> 
 
     <p>blabla</p> 
 
     </aside> 
 
     </div> 
 
    </div> 
 
    <div class="category-4"> 
 
    <div class="content"> 
 
     <aside> 
 
     <p>blabla</p> 
 
     </aside> 
 
     </div> 
 
    </div> 
 
    </div>