CSS Transparente div-container
Niclas Bell
- css
Hallo Leute,
ich versuche eine Layout für eine Website zu entwerfen und wolte transparente div container einbinden. Ich habe ein Hintergrund Bild und aus diesem befindet sich der transparente container. In diesem befinden sich ein paar weitere container. Das passt auch alles. Mein Problem ist jetzt, dass egal was ich mache, alles innerhab der container transparent ist. Ich hätte gerne schrifft und Bilder nicht transparent. Ich habe auch schon versucht den Filter in einem neuen div auf zu heben aber es funktioniert nicht. Vielleicht gibt es auch nur andere Möglichkeit aber es wäre super wen ihr mir helfen könntet
#container
{
margin: 1em auto;
width: 1100px;
height: 600px;
text-align: left;
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
background-color: white;
border: 1px solid black;
}
#head
{
float: right;
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
width: 800px;
height: 100px;
background-color: black;
}
#header{
float: left;
width: 300px;
height: 100px;
}
#balken{
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
height: 10px;
background-color:red;
}
#rand
{
float: left;
width: 57px;
height: 400px;
}
#menu
{
float: left;
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
width: 244px;
height: 500px;
background-color: black;
}
#not-id
{
filter:alpha(opacity=300);
-moz-opacity:3.0;
-khtml-opacity: 3.0;
color: black;
font: 200% comic-sans, times, "times new roman", serif;
font-weight: blod;
margin: 0 0 2px 0;
}
</style>
</head>
<body>
<div id="not">
<table style="position:absolute; top:80px; left:400px;">
<tr><td><h1>ich sollte nicht durchsichtig sein</h1></td></tr>
</table>
<div id="container">
<div id="head">
</div>
<div id="header">
<img src="adler.jpg" width="300" height="100">
</div>
<div id="rand"></div>
<div id="menu">
<div id="balken"></div>
</div>
</div>
</div>
Hi,
ich versuche eine Layout für eine Website zu entwerfen und wolte transparente div container einbinden. Ich habe ein Hintergrund Bild und aus diesem befindet sich der transparente container. In diesem befinden sich ein paar weitere container. Das passt auch alles. Mein Problem ist jetzt, dass egal was ich mache, alles innerhab der container transparent ist.
Ja, so wirkt opacity nun mal - das macht *alle* Inhalte, alle Nachfahrenelemente mit teiltransparent; und nein, du kannst es nicht weiter unten im Elementbaum „wieder zurücksetzen“.
Ich hätte gerne schrifft und Bilder nicht transparent.
Dann nutze eine rgba()-Angabe für die Hintergrundfarbe - und alternativ, für die Browser, die das noch nicht unterstützen, ein entsprechend teiltransparentes PNG-Hintergrundbild.
(Um IE 6 bitte keine Sorgen machen. Ist es nicht wert.)
MfG ChrisB
Grüße,
Dann nutze eine rgba()-Angabe für die Hintergrundfarbe
imho scheisse dass es keine hexangabe erlaubt - paletten mancher grafiktools liefern hexwerte, in dezimal muss man dann selbs tumrechnen :(
MFG
bleicher