Forums Développement Multimédia

Les formations Mediabox
Les formations Mediabox

La transparence CSS

Compatible CSS. Cliquer pour en savoir plus sur les compatibilités.Le 17 février 2006

Combien d'entre-nous ne se sont pas encore penché sur la transparence pour le Web. Difficile problème car en général non-valide. Je ne vous propose malheureusement pas la panacée universelle valide mais apporte un élément de plus j'espère.

Solution PNG

Histoire de rester conforme aux traditions, IE fait des siennes, impossible d'avoir un PNG plus ou moins translucide

Solution GIF

Depuis quand le Gif prend-t-il le transparence translucide (je sais que cela n'existe pas comme terme)

Solution CSS3

Les navigateurs ne les prennant pas encore en compte… C'est plus difficile :D

Solution CSS hack

Enfin une solution qui pointe le bout de son nez. Trois lignes (invalide bien sûr :() permettent d'avoir la translucidité dans ces balises HTML.

filter:alpha(opacity=60);  
-moz-opacity:0.60;
opacity: 0.60;

Voili voilà. Ces trois lignes vous permettent d'avoir une balise à 60 pourcent d'opacité.

Détail

Première ligne : filtre propriétaire d'IE
Deuxième ligne : filtre propriétaire de Mozilla/Firefox
Troisième ligne : CSS3

Remarque Publié originelement sur Ac-graphic Studio