Hintergrundfarbe auch transparent möglich?

[Matthias]

Hallo Leute!
Ich habe folgendes Problem.
Ich habe ein Seitenhintergrundbild. Dieses ist ein JPG und hat eine bestimmte Färbung. Alle Eigenschaften sind per CSS definiert wie Position, Z-Layer etc.

Darüber habe ich nun im Stylesheet mehrere Definitionscontainer gemacht, mit denen ich nun die DIV-Tags mit dem Seiten-Content beeinflusse. So ist zum Beispiel eine Navigationsleiste mit einem CSS-Tag bachground-color: #... versehen und mit Z-Layer über das Hintergrundbild gelegt.

Für das Inhaltsfenster möchte ich nun aber, dass das eigentliche Hintergrundbild der Gesamtseite leicht durch den Content hinduchschimmert. Ich wollte also fragen, ob es eine Möglichkeit gibt, die Angabe des Hintergrunds mittels CSS mit einer Transparenz zu versehen.

Vielen Dank für die Antwort,
Matthias

[Gunnar Bittersmann]

@@Matthias:

nuqneH

Für das Inhaltsfenster möchte ich nun aber, dass das eigentliche Hintergrundbild der Gesamtseite leicht durch den Content hinduchschimmert. Ich wollte also fragen, ob es eine Möglichkeit gibt, die Angabe des Hintergrunds mittels CSS mit einer Transparenz zu versehen.

'opacity'.

Allerdings wirkt diese Eigenschaft auf das ganze Element: nicht nur auf dessen Hintergrund, sondern auch auf den Vordergrund (den Text).

Verwende ein PNG mit Teiltransparenz. Und ggfs. Workaround für IE < 7.

Qapla'

[suit]

Alle Eigenschaften sind per CSS definiert wie Position, Z-Layer etc.

Was ist Z-Layer?

einem CSS-Tag bachground-color:

CSS kennt Deklarationen, zusammengesetzt aus Selektoren, Eigenschaften und Werten

Z-Layer

Schon wieder :)

Ich wollte also fragen, ob es eine Möglichkeit gibt, die Angabe des Hintergrunds mittels CSS mit einer Transparenz zu versehen.

Nein diese Möglichkeit gibt es leider nicht - es gibt aber zwei sinnvolle Workarounds:

1. Verändere die Deckkraft des Elements.
   pro: sehr einfache Lösung
   con: die Deckkraft sämtlicher Nachfahrenelemente nimmt ebenfalls ab.

2. Ersetze die Hintergrundfarbe durch ein Hintergrundbild mit Alphatransparenz.
   pro: äußerst flexibel
   con: funktioniert nur mittels einem weiteren Workaround in Browsern ohne nativen Alphatransparenz-Support

Tendentiell würde ich zu zweiterem raten.