nicht angemeldet ottogal
Gunnar Bittersmann
ottogal
Der Martin
Matthias Apsel
ottogal
Der Martin
ottogal
ottogal
Hallo in die Runde,
ein Div #content bekommt den style "opacity: 0.8;", damit das Hintergrundbild des body etwas durch den Text von darin enthaltenen p-Elementen durchschimmert.
Das Problem: Er schimmert natürlich auch durch img-Elemente durch, was weniger schön ist.
Gibts da eine Lösung?
Dank und Gruß
ottogal
Hallo,
ein Div #content bekommt den style "opacity: 0.8;", damit das Hintergrundbild des body etwas durch den Text von darin enthaltenen p-Elementen durchschimmert.
Das Problem: Er schimmert natürlich auch durch img-Elemente durch, was weniger schön ist.
Ja, opacity wird von den Kindselementen geerbt.
Gibts da eine Lösung?
Wenn du das Bild als PNG 24 abspeicherst dann kannst du direkt im Bild die Durchsichtigkeit speichern und brauchst es gar nicht mit CSS machen.
Jeena
@@Jeena Paradies:
nuqneH
Wenn du das Bild als PNG 24 abspeicherst dann kannst du direkt im Bild die Durchsichtigkeit speichern und brauchst es gar nicht mit CSS machen.
Nö. 'body' hat das Hintergrundbild, nicht '#content'.
(Wozu eigentlich das 'div'? Ist das nicht völlig überflüssig?)
Ich vermute, die Lösung ist eine RGBA-Hintergrundfarbe für '#content'. Bzw. für 'body'; und 'html' bekommt das Hintergrundbild. (Beispiel)
Qapla'
Hallo,
Nö. 'body' hat das Hintergrundbild, nicht '#content'.
Darum ging es ja nicht, es ging darum dass die <img> innerhalb von #content auch druchsichtig werden.
(Wozu eigentlich das 'div'?
Woher weißt du dass da ein div ist und es nicht notwendig ist?
Ich vermute, die Lösung ist eine RGBA-Hintergrundfarbe für '#content'. Bzw. für 'body'; und 'html' bekommt das Hintergrundbild. (Beispiel)
Nach nochmaligem lesen habe ich festgestellt dass das durchscheinen durch den Text erwünscht ist.
Jeena
(Wozu eigentlich das 'div'? Ist das nicht völlig überflüssig?)
Das lag nicht in meiner Hand: Muss in ein vorliegendes Template nachträglich die Transparenz einbauen.
Ich vermute, die Lösung ist eine RGBA-Hintergrundfarbe für '#content'. Bzw. für 'body'; und 'html' bekommt das Hintergrundbild. (Beispiel)
In dem Beispiel bekommt body die Eigenschaften
background: rgb(192, 196, 200);
background: rgba(255, 255, 240, 0.67);
~~~Überschreibt da die zweite die erste, oder welchen Sinn hat diese sonst?
Hallo,
background: rgb(192, 196, 200);
background: rgba(255, 255, 240, 0.67);
> Überschreibt da die zweite die erste, oder welchen Sinn hat diese sonst?
Ja. Die erste ist dann noch da damit sie Browser benutzen können, die kein rgba() kennen.
Jeena
--
[Jlog](http://jeenaparadies.net/webdesign/jlog/) | [Gourmetica Mentiri](http://jeenaparadies.net/gourmetica-mentiri/)
Hi,
(Beispiel)
In dem Beispiel bekommt body die Eigenschaften
background: rgb(192, 196, 200);
background: rgba(255, 255, 240, 0.67);
> Überschreibt da die zweite die erste [...]?
Normal ja.
Der Sinn ist, dass alle Browser zuerst die erste Definition verarbeiten und verstehen. Diejenigen, die RGBA-Farben unterstützen, interpretieren auch die zweite Angabe und ersetzen damit die bisherige Definition. Ältere Browser, die von RGBA nichts wissen, erkennen die zweite Definition als fehlerhaft und ignorieren sie, die erste behält dann ihre Gültigkeit. Dann gibt's halt einen nicht-transparenten Hintergrund.
Ciao,
Martin
--
Lieber Hahn im Korb, als Tiger im Tank.
Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
Om nah hoo pez nyeetz, ottogal!
background: rgb(192, 196, 200);
background: rgba(255, 255, 240, 0.67);
Ja, aber nur für Browser, die auch die zweite verstehen. Für alte Browser bleibt die erste Farbe. So hast du wenigstens nicht den default-Hintergrund (meist weiß).
Matthias
--
1/z ist kein Blatt Papier.
Capito, das macht Sinn. Danke!
Wenn du das Bild als PNG 24 abspeicherst dann kannst du direkt im Bild die Durchsichtigkeit speichern und brauchst es gar nicht mit CSS machen.
Das verstehe ich jetzt nicht. Selbst wenn ich dem PNG24-Bild Undurchsichtigkeit verpasse, wird es - als Kindelement von #content - doch wieder die teilweise Transparenz von #content erben.
Hallo,
Das verstehe ich jetzt nicht. Selbst wenn ich dem PNG24-Bild Undurchsichtigkeit verpasse, wird es - als Kindelement von #content - doch wieder die teilweise Transparenz von #content erben.
Hm ja ich habe deine Frage wohl falsch verstanden und nicht bedacht dass das durchscheinen durch den Text erwünscht ist.
Leider habe ich auf die Schnelle keine Lösung für dein Problem außer dass du die Texte in andere Tags einbaust als die Bilder und nur den tags mit texten eine opacity gibst.
Jeena
Hi,
ein Div #content bekommt den style "opacity: 0.8;", damit das Hintergrundbild des body etwas durch den Text von darin enthaltenen p-Elementen durchschimmert.
Das Problem: Er schimmert natürlich auch durch img-Elemente durch, was weniger schön ist.
Gibts da eine Lösung?
ja, Gunnar hat eigentlich genau die richtige Idee gehabt, vielleicht kam sie nicht klar genug rüber:
Verzichte auf opacity (denn das vererbt sich an Kindelemente), und nimm stattdessen eine RGBA-Hintergrundfarbe für #content. Damit erreichst du denselben Effekt, nur mit dem Unterschied, dass ausschließlich der Hintergrund von #content teiltransparent wird, und nicht auch noch seine Kindelemente.
Ciao,
Martin
Schön erläutert, danke dir. Werd es ausprobieren.
Die RGBA-Idee ist die Lösung!
Vielen Dank nochmal an Martin, Gunnar und die anderen - was für ein Segen, dass man euch wieder mit Fragen behelligen kann...
Ein verspätetes Dankeschön daher auch an alle die, die sich für die Wiedererweckung des Forums ins Zeug gelegt haben!