CSS - Directive @apply
@apply est une directive du langage déclaratif CSS, qui introduit la notion de variables,
ou de quelque chose qui s'en rapproche beaucoup. Elle permet de mémoriser des valeurs ou des groupes de
valeurs, en vue d'un usage ultérieur.
Description de la directive @apply.
@apply applique une propriété ou un groupe de propriétés préalablement définies.
Ce groupe aura reçu un nom, et c'est ce nom qu'il faudra indiquer pour @apply.
Ceci permet par exemple de définir les couleurs d'une charte graphique qui seront
utilisées un peu partout dans le document.
On peut aussi envisager de définir des groupes de propriétés qui, eux aussi, seront
ré-utilisables par la suite.
:root {
--rouge-charte: #ff4030;
--bleu-charte: #40ff30;
--couleurs-charte: {
color:CornflowerBlue;
background:floralWhite;
};
}
h2 {@apply --rouge-charte;}
p {@apply --couleurs-charte;}
Prise en charge par les navigateurs (compatibilité).
Il faudra attendre encore un peu pour que les navigateurs traitent la règle @apply.
Afficher le tableau de compatibilité (informations fournies par canIuse.com).