Grouper les déclarations CSS similaires

Identifiants

Catégories

Indications

Description

Lorsque plusieurs éléments du DOM (Document Object Model) ont des propriétés CSS communes, les déclarer ensemble dans la même feuille de styles. Cette méthode permet de réduire le poids de la CSS.

Exemple

Ne pas écrire :

h1 {
background-color: gray; color: navy;
}

h2 {
background-color: gray; color: navy;
}

h3 {
background-color: gray; color: navy;
}

mais plutôt :

h1, h2, h3 {
background-color: gray; color: navy;
}

Si vous souhaitez vous assurer que cette règle est bien respectée, vous pouvez mettre en place le module stylelint dans votre projet (devDependencies) et utiliser la règle shorthand-property-no-redundant-values

Vous trouverez la liste complète de ces propriétés raccourcies sur le site MDN

Principe de validation