CSS: Couleur du texte dégradé?

J'essaie d'obtenir du texte pour avoir une couleur dégradée, mais je n'ai pas la moindre idée de comment. Je suis en train de le faire comme ceci:CSS: Couleur du texte dégradé?

Gradient image

La seule chose que j'ai essayé est -webkit-mask, mais je ne pouvais pas obtenir que le travail que je voulais à. L'autre chose serait -webkit-gradient dans la propriété color - est-ce possible?

La compatibilité croisée est assez importante, mais pas la fin du monde. Je préférerais que le texte soit une couleur unie dans IE plutôt que de convertir le tout en une image (il y a pas mal de texte comme ça, en partie dynamique).

Source

2012-08-31 callumacrae

Pour les navigateurs basés sur webkit (Chrome & Safari):

.text { 
    font-size: 20px; 
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#111)); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
}

Pour IE & autres:

http://www.webdesignerwall.com/demo/css-gradient-text/

Source

2012-08-31 13:02:43

Merci. Connaissez-vous un moyen de le faire d'autres navigateurs, aussi? Je l'aimerais si cela fonctionnait dans WebKit et Firefox minimum (bien que IE serait extrêmement gentil). – callumacrae

Quelle version de IE à partir de? –

Juste 9 et au-delà. – callumacrae

CSS: Couleur du texte dégradé?

Répondre

Questions connexes