Syntaxe de Regroupement
Regrouper les sélecteurs
Imaginez que vous voulez que le texte des éléments h1 h2 et h3 soit en rouge.
Logiquement, vous auriez écrit ceci :
h1 {color : red ;}
h2 {color : red ;}
h3 {color : red ;}
Mais pour gagner du temps et de la place dans votre feuille de style, vous pouvez regrouper les sélecteurs et leur affecter le même style.
Exemple :
h1,h2,h3{color : red ;}
Ainsi, nous n’avons écrit qu’une seule ligne de code, et le texte des éléments h1 h2 et h3 sera en rouge.
Pour regrouper plusieurs sélecteurs, il suffit donc de les séparer par une virgule.
Regrouper les déclarations
Pour travailler plus simplement, vous pouvez regrouper les déclarations. Je vais vous expliquer cette méthode avec un exemple précis :
p {color : blue ; }
p {text-align : center ; }
p {text-decoration : underline ; }
Nous allons donc regrouper les déclarations de l’exemple ci-dessus de cette façon :
p {
color : blue ;
text-align : center ;
text-decoration : underline ;
}
Pour regrouper les déclarations, vous les mettez toutes entre une seule paire d'accolades, et vous les séparez par des points-virgules.