2016-08-18 3 views
0

je les suivantes:CSS: une propriété pour plusieurs classes

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

Comment utiliser une marge supérieure pour tous les trois catégories?

Répondre

3

Utilisez le « » char partager votre propriété à plusieurs sélecteurs:

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

Cette façon de mise en forme est appelée css virgule sélecteur séparés, comme le suggère @ Aaron.

+2

Ceci est appelé sélecteurs séparés par des virgules! – Aaron

1

vous pouvez utiliser:

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

soit vous écrivez comme si

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

ou il dépend du reste de la structure html pour par exemple

#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>