Version complète: sur le forum Webmaster Hub : Dégradé en CSS
Webmaster Hub > Création et exploitation de Sites Internet > Les langages du Net > (X)HTML et CSS
criocere
Hello,

Y a-t-il moyen de faire des dégradés sur des images avec une feuille de style CSS ?

J'ai bien trouvé "filter: Alpha" mais c'est spécifique à IE , ne marche pas en tout cas sur Mozilla.
Wanbli
Hé hé ... baisse un peu les yeux ... j'ai posé la question il y a quelques jours ... en cliquant sur ce post tu trouveras qq éléments de réponse ... wink.gif

http://www.webmaster-hub.com/index.php?showtopic=3925
Loupilo
filter: Alpha est une balise inventée par Microsoft et en aucun cas reconnue par tout navigateur respectant les règles existantes wink.gif

La seule solution actuelle est donc l'image de fond...
Dans une future version du Css, qui sait ?

++
criocere
oups, j'avais pas vu Wanbli ! Ca semble sans solution !
Wanbli
CITATION(criocere @ vendredi 18 juin 2004, 00:57)
oups, j'avais pas vu Wanbli ! Ca semble sans solution !

bin ... pas tout à fait ... ne sois pas défaitiste ... la solution existe meme si c'est loin d'être le plus pratique :

Créer une image de fond dégradée et l'appliquer à l'endroit voulu ...

Certes ça fait un peu bricolage mais quand on voit le nombre de sites qui font du dégradé en ce moment ... ça doit etre une solution largement répandue ... et c'est la 1ere à laquelle j'avais pensé, sans me douter que c'était la seule possibilité en ce moment ...

Tiens nous au courant du résultat si tu te lances dans l'aventure !
criocere
La solution, c'est le SVG. Tu peux générer comme tu le souhaites ton image et y définir un dégradé linéaire par exemple :
http://www.yoyodesign.org/doc/w3c/svg1/ima...s/lingrad01.svg

Un dégradé radial, créé à la volée :
http://www.yoyodesign.org/doc/w3c/svg1/ima...s/radgrad01.svg

Le problème est qu'il faut le plugin et il n'est pas dispo dans tous les navigateurs.

Sympa, non ?

@++
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.