Cela peut être Compass 101, mais quelqu’un a-t-il écrit un mixin qui définit la valeur alpha d’une couleur? Idéalement, je voudrais que le mixin prenne toute forme de définition de couleur et applique la transparence:
@include set-alpha( red, 0.5 ); //prints rgba(255, 0, 0, 0.5); @include set-alpha( #ff0000, 0.5 ); //prints rgba(255, 0, 0, 0.5); @include set-alpha( rgb(255,0,0), 0.5 ); //prints rgba(255, 0, 0, 0.5);
Utilisez la fonction rgba
intégrée à Sass
Définit l’opacité d’une couleur.
Exemples:
rgba (# 102030, 0.5) => rgba (16, 32, 48, 0.5)
rgba (bleu, 0.2) => rgba (0, 0, 255, 0.2)Paramètres:
Couleur (couleur)
(Number) alpha – Un nombre entre 0 et 1Résultats:
(Couleur)
Code:
rgba(#ff0000, 0.5); // Output is rgba(255,0,0,0.5);
J’utilise le plugin rgbapng compass
rgbapng est un plugin Compass pour fournir un support RGBA compatible entre navigateurs *. Cela fonctionne en créant des PNG alpha-transparents à un seul pixel à la volée pour les navigateurs qui ne supportent pas le RGBA. Il utilise la bibliothèque Ruby ChunkyPNG pure pour une installation et un déploiement sans souci.
Installer
gem install compass-rgbapng
Usage
@include rgba-background(rgba(0,0,0,0.75));
Comstack pour:
background: url('/images/rgbapng/000000bf.png?1282127952'); background: rgba(0, 0, 0, 0.75);
Il y a aussi ie-hex-str () pour le format ## AARRGGBB d’IE:
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str(#fdfdfd)}', endColorstr='#{ie-hex-str(#f6f6f6)}',GradientType=0); /* IE6-9 */
from_hex(hex_ssortingng, alpha = nil);
De la documentation :
Créez une nouvelle couleur à partir d’une chaîne hexadécimale CSS valide. Le hash principal est facultatif.