Halbtransparente Hintergründe für die Webseite

Transparente Bilder sind oft ein schmückendes und effektvolles Beiwerk auf Webseiten. Die Darstellunf von transparenten Bildern im .png Format wird von den Browsern jedoch nicht einheitlich unterstützt. Die Angaben der Transparenz im stylesheet auch nicht. Eine Alternative ist jedoch über einen Trick mit einem transparenten .gif machbar.

[Translucent Backgrounds]

  1. Erstelle ein Bild 2 x 2 Pixel groß in weiß.
  2. Das Pixel in der linken oberen und in der rechten unteren Ecke mit der Farbe einfärben, die später transparent sein soll.
  3. Das Bild als Muster (Pattern) abspeichern.
  4. Ein weiteres Bild mit 50 x 50 Pixel erstellen und mit dem soeben gespeicherten Muster füllen.
  5. Das ganze als 8-Bit-Gif speichern und beim Speichern die weißen Pixel als transparent definieren.
  6. Im Stylesheet angeben — background: transparent url(imagename.gif) —

Fertig !