Version complète: sur le forum Webmaster Hub : rendre une image opaque
Webmaster Hub > Création et exploitation de Sites Internet > Les fondations d'un site > Le Webdesign
burinho
Bonjour,

j'aimerais utiliser une image que j'aimerais scinder en deux , une partie pour le menu de mon site et le reste en arrière plan mais j'aimerais la rendre un peu opaque afin qu'elle soit discrete.
En faite il faudrait mettre en voile mais je vois pas trop comment faire.
Kynerion
Bonjour,

Opaque : qui n'est pas transparent, qui ne laisse pas passer la lumière.
Ce n'est pas plutôt le contraire que tu veux, pour rendre l'image plus discrète? ^_^

Dans ce cas pour "mettre un voile", qui consiste en fait à rendre l'image plus transparente, il faut jouer sur l'opacité de celle-ci dans un logiciel de retouche comme Photoshop ou The Gimp. En clair, passer d'une opacité de 100% à une autre plus basse (50%, voire même moins pour la rendre vraiment "discrète").

Et puis il faudra l'enregistrer au format .gif ou .png (surtout celui-là wink.gif)
Et donc il faudra un navigateur qui gère correctement la transparence... rolleyes.gif
Sebastien
Il y a aussi l'astuce de la fausse transparence en utilisant 2 images, et celle du damier gif avec 1 pixel sur 2 transparent qui permet une pseudo transparence, utilisé ici : http://www.csszengarden.com/?cssfile=069/069.css
burinho
en effet c'est bien la rendre plus discrete, j'ai bien essayer avec le gimp mais j'y suis pas arrivé
petit-ourson
CITATION(Sebastien @ vendredi 10 mars 2006, 09h23)
Il y a aussi l'astuce de la fausse transparence en utilisant 2 images, et celle du damier gif avec 1 pixel sur 2 transparent qui permet une pseudo transparence, utilisé ici : http://www.csszengarden.com/?cssfile=069/069.css
*

Tient je n'avais jamais remarqué cette astuce ;o)
Dudu
Salut,

il y a aussi tout simplement la propriété CSS opacity wink.gif
Idem il faut un navigateur correct pour la comprendre..

Çà permet de ne pas créer d'images supplémentaires smile.gif
burinho
css opacity, c'est a dire ?
Dudu
Le langage CSS wink.gif
La règle "opacity".

Exemple:
CODE
img.discrete {opacity:.9;}
et tu auras une opacité de 90%.
Et ainsi de suite smile.gif
burinho
C'est de la balle ce truc, c'est encore mieux que avec the gimp

par contre cela marche pas avec iE
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.