folgende Aufgabe:
ich habe eine Seite (lokal) die ein Hintergrundbild hat. Davor sind Tabellen. Bei diesen Tabellen kann man ja einen Hintergrund einbauen (Farbe, Bild, etc.), jedoch nicht transparent. Es soll dann so sein, daß (zwecks besserer Lesbarkeit der Tabellen) die Tabelle auf einem halbtransparentem, gräulich-weissem Bild liegt, sodaß an der Stelle, wo die tabelle ist, das Hintergrundbild abgeschwächt ist, aber dennoch leicht sichtbar.
Das soetwas nicht im Standard vorgesehen ist, habe ich via Frontpage (jaja, ich weiß...) eine halbtransparente, freischwebende Autoform (Rechteck, ca. 80% transparent) darüber gelegt.
Ergebnis: funzt (aber nur im Internet Explorer, da es IMO ein Office-Feature ist).
Im Firefox funzt das nicht, da fehlen die Autoformen auf der Seite einfach...
Die Frage:
wie bringe ich dem Firefox bei, daß er die Auoformen darstellt?
Gibt es eine andere Lösung dafür?
*edit*
ich habe es nun gefunden, falls jemand eine Lösung sucht, dann hierher geguckt:
http://standards.webmasterpro.de/index- ... Tipps.html
Ein Beispielcode:
Code: Alles auswählen
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#box{
width:300px;
height:300px;
padding:20px;
}
#transparent{
position:relative;
opacity: 0.5;
-moz-opacity:0.5;
-khtml-opacity:0.5;
filter:alpha(opacity=50);
background:white;
}
#transparent *{
color:black;
}
</style>
</head>
<body link="#008080" vlink="#008080" alink="#008080" background="hintergrund.jpg">
<div id="box">
<div id="transparent">
<p>ganz viel Text ganz viel Text ganz viel Text ganz viel Text ganz viel Text ganz viel Text ganz viel Text ganz viel Text ganz viel Text ganz viel Text ganz viel Text ganz viel Text ganz viel Text ganz viel Text ganz viel Text ganz viel Text </p>
</div>
</div>
</body>
</html>
habe nun folgenden Code:
Code: Alles auswählen
...
<style type="text/css">
#box{
width:500px;
height:500px;
padding:50px;
}
#transparent{
position:relative;
opacity: 0.2;
-moz-opacity:0.2;
-khtml-opacity:0.2;
filter:alpha(opacity=20);
background:white;
}
#transparent *{
color:red;
}
</style>
</head>
<body link="#008080" vlink="#008080" alink="#008080" background="campfires2k2.jpg">
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="90%" id="transparent">
<tr>
<td width="33%"><font color="#FF0000" face="Comic Sans MS"><b> News</b></font></td>
<td width="33%"><font color="#FF0000" face="Comic Sans MS"><b> Nachschlagen</b></font></td>
<td width="34%"><font color="#FF0000" face="Comic Sans MS"><b> Suche & Service</b></font></td>
</tr>
...