# Transparente Bilder



## Snewi133 (27. November 2007)

Hallo

ist es über CSS irgendwie möglich Bilder Transparent darzustellen?

Gruß


----------



## Maik (27. November 2007)

Hi,

ja das ist möglich:


```
img {
filter:alpha(opacity=50); /* IE */
-moz-opacity:0.5; /* Gecko-Browser */
opacity:0.5; /* Opera 9+ */
}
```
Ansonsten gibt es noch transparente bzw. semi-transparente PNGs.


----------



## Snewi133 (27. November 2007)

Hi

muss ich denn vorher mit Photoshop die Transparenz einstellen und als png speichern und ganz normal einbinden oder passiert es durch den obengenannten Code vonn alleine bei allen bildern?

Gruß


----------



## Maik (27. November 2007)

Entweder erstellst du dir ein transparentes PNG und benötigst obiges Stylesheet überhaupt nicht, oder du wendest das Stylesheet auf ein "normales" (nicht-transparentes) Bild an.


----------



## Snewi133 (27. November 2007)

Was ist wenn ich das img nicht anwenden und Bilder über das stylesheet einbinde?

Gruß


----------



## Maik (27. November 2007)

```
.box {
filter:alpha(opacity=50);
-moz-opacity:0.5;
opacity:0.5;
background:url(pfad/zur/grafik.jpg);
position:absolute;
}
```


```
<div class="box">test</div>
```
Der Haken an dieser Variante: sie funktioniert nur, wenn das Element absolut positioniert ist.

Weitaus eleganter und flexibler ist da ein transparentes PNG als Elementhintergrund.


----------

