Gunnar Bittersmann: Transparenz

Beitrag lesen

SELF-Forum

Transparenz

Gunnar Bittersmann Homepage des Autors
– Informationen zu den Bewertungsregeln

@@Udo:

nuqneH

Ich möchte über ein Hintergrundbild eine Textbox mit halb-transparentem Hintergrund legen. Die Schrift soll aber gut lesbar (also nicht transparent) sein.

Im IE klappt das, wie ich es mir vorstelle.

Hm, tatsächlich: Der IE vergisst, die Schrift bei positionierten(!) Nachfahren(!)-Elementen transparent zu rendern. Is it a feature or a bug?

<!DOCTYPE html>  
<html xmlns="http://www.w3.org/1999/xhtml">  
  <head>  
    <meta charset="UTF-8"/>  
    <title>TEST</title>  
    <style>  
[code lang=css]body  
{  
	background: black;  
}  
  
p  
{  
	background: white;  
	color: white;  
	filter: alpha(opacity=33);  
	zoom: 1;  
}  
  
span  
{  
	position: relative;  
}

</style>
  </head>
  <body>
    <p><span>Weißer Adler</span> auf weißem Grund</p>
  </body>
</html>[/code]

Zeigt "Weißer Adler" opak (deutlich sichtbar); "auf weißem Grund" ist genauso transparent wie der Hintergrund (also nicht sichtbar).

Der 7er braucht dazu allerdings hasLayout (bspw. per 'zoom: 1'). Einer Tabelle bedarf es dazu nicht.

Beispielcode:
<body background="background.jpg">
<div align="right">
<table height="200" width="200" bgcolor="#FF0000" style="filter:alpha(opacity=50);">
<tr>
<td><span style="position: relative;"><b>Hello </b></td>
</tr>
</table>

</div>

Ist übles Markup: ungerechtfertigtes „müffelndes“ 'table'-Element, missbilligte HTML-Attribute zur Darstellung, @style-Attribute.

Gib sämtliche Darstellung per CSS an, und zwar nicht inline, sondern im Stylesheet!

Qapla'

--
Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
(Mark Twain)
Beitrag melden
–
Informationen zu den Bewertungsregeln