Extend

Par Clouder le 22 Feb 2019 0 +99

Extend en Sass


La fonction @extend de Sass permet à une classe d’hériter des styles d’une autre. L'utilité d'une telle architecture est de permettre de créer une classe pilote permettant d'être réutilisable dans d'autres classes.


Voici un exemple d’une classe utilisant la fonction @extend :

.alert {
    padding: .5em;
}

.alert-error {
    @extend .alert;
    color: red;
}


Le résultat en CSS donnerait ceci :

.alert, .alert-error { 
    padding: .5em;
}

.alert-error{
    color: red;
}


C'est facile, non ? Bien sûr la fonction @extend n’est pas limitée qu'aux classes, vous pouvez l'utiliser sur à peu près tous.

Cette pub permet au site de vivre ...

Commentaire

Tu veux participer ?
Alors connecte toi ou inscris toi et viens participer !