Tipp: Transparenzen mit CSS erzeugen

Mit der CSS Eigenschaft opacity kann man einem Container auf einfache Art und Weise eine Transparenz zuweisen. Hier ein kleines Beispiel:

<style type="text/css" media="screen">
  #box {
    width: 100px;
    height: 100px;
    opacity: 0.7;
    filter: Alpha(opacity=70);
    background-color: #2E89CF;
  }
</style>

<div id="box"></div>

Im Beispiel wird eine Deckkraft von 70% erzeugt. Die Zuweisung mittels opacity: 0.7; wird von allen modernen Browsern verstanden. Um das ganze auch noch für ältere Versionen des Internet Explorers kompatibel zu machen verwende ich zusätzlich die Zuweisung filter: Alpha(opacity=70);, welche nur vom IE verstanden und von allen anderen Browsern ignoriert wird.

Das ganze sieht bei entsprechenden Angaben dann in etwa so aus: