@extend - Le sélecteur pour héritage uniquement.
Pour créer une classe uniquement disponible sous forme d'héritage, vous pouvez utiliser "%".
Les classes qui utilisent "%" ne sont pas présentes dans le fichier CSS généré.
Exemple SCSS :
$bg-color: #00f;
%bigblue {
color: $bg-color;
font-size: 2em;
font-weight: bold;
}
.notice {
@extend %bigblue;
}
Résultat CSS après compilation :
.notice {
color: #00f;
font-size: 2em;
font-weight: bold;
}