Modifier l'opacité alpha de la variable LESS


171

En utilisant LESS, je sais que je peux changer la saturation ou la teinte d'une variable de couleur. Cela ressemble à ceci:

background: lighten(@blue, 20%);

Je veux cependant changer l'opacité alpha de ma couleur. De préférence comme ceci:

background: alpha(@blue, 20%);

Existe-t-il un moyen simple de le faire en MOINS?

Réponses:


303

La documentation du site donne la réponse:

background: fade(@blue, 20%);

Le nom de la fonction fadene alphacorrespond pas à ce document.


Merci! J'en ai assez de tout convertir en RGBA!
BillyNair

Je cherchais l'assombrissement et l'éclaircissement .. Docs m'a amené là-bas. Merci

1
Je suis d'accord que «fondu» ne me semble pas exact. Sass le fait correctement: alpha (), opacity () et rgba ().
Rich Finelli

2
Pour mémoire, fade()ne fonctionne pas avec les variables CSS - iefade(var(--mycolor), 20%)
ed1nh0

26

Par souci d'exhaustivité

se faner

Définit la transparence absolue d'une couleur. Peut être appliqué aux couleurs, qu'elles aient déjà une valeur d'opacité ou non.

background: fade(@blue, 20%);

fondu

Diminue la transparence (ou augmente l'opacité) d'une couleur, la rendant plus opaque.

background: fadein(@blue, 80%);

disparaître

Augmentez la transparence (ou diminuez l'opacité) d'une couleur, la rendant moins opaque. Pour un fondu dans l'autre sens, utilisez le fondu.

background: fadeout(@blue, 20%);

Voir la documentation complète


1
Fadeout est exactement ce que je recherchais, merci!
maxime1992
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.