bg-image über CSS in externer Datei geht nicht
pheb62
- css
Hallo,
ich zerbrech mit den Kopf was ich falsch mache:
Ich habe eine HTML-Seite, die in Verzeichnis d:\sites\abc liegt,
ein externes Stylesheet d:\sites\css,
in der Seite ist es eingebunden mit
<LINK REL="STYLESHEET" HREF="css/color.css">.
Es gibt zwei Varianten des Stylesheets, die jeweils die gleichen Klassen enthalten, lediglich die Farben sind für Sommer und Winter unterschiedlich. Zum "Umschalten" wird nur die passende CSS-Vorlage sommer.css oder winter.css auf das eigentliche Stylesheet color.css draufkopiert.
Das funktioniert seit Jahren so tadellos.
Nun möchte ich ein Hintergrundbild in eine Tabellenzelle bekommen. Diese ist mit
<TD ALIGN="CENTER" WIDTH="305" HEIGHT="203"> </TD>
auch passend groß dimensioniert.
Wenn ich das Bild per "<STYLE>" direkt im HTML-Dokument mache erscheint es auch:
<TD ALIGN="CENTER" WIDTH="305" HEIGHT="203" STYLE="background-image: url(img/awh_wi.jpg)"> </TD>
Nun möchte ich dies aber per CSS-Klasse machen, damit durch das Umkopieren des Stylesheets ebenfalls ein zu den Farben passendes Bild erscheint.
Dazu habe ich eine Klasse wie folgt definiert:
.bild {
background-image: url(img/awh_wi.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
}
Die Zelle ist dann mit
<TD ALIGN="CENTER" WIDTH="305" HEIGHT="203" CLASS="bild"> </TD>
definiert.
Ich kann nun machen was ich will - über diese Methode erscheint das Bild einfach nicht.
Was mach ich falsch? Oder geht das mit dem bg-image einfach nicht, wenn die Definition in einer externen CSS-Datei steckt?
Das ganze soll unabhängig von JavaScript funktionieren, und zumindest im IE >= 6, nach Möglichkeit aber in allen Browsern ohne spezielle Programmierung funktionieren.
Für ein paar hilfreiche Beiträge wäre ich dankbar.
Gruß,
Peter
Hallo pheb62.
Die Zelle ist dann mit
<TD ALIGN="CENTER" WIDTH="305" HEIGHT="203" CLASS="bild"> </TD>
definiert.Ich kann nun machen was ich will - über diese Methode erscheint das Bild einfach nicht.
Was mach ich falsch?
Du übersiehst, dass du in einem externen Stylesheet auch von diesem aus referenzieren musst und nicht vom HTML-Dokument, in welchem das Stylesheet verwendet wird.
Bei dir also vermutlich:
.bild {
background-image: url(../abc/img/awh_wi.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
}
Einen schönen Montag noch.
Gruß, Mathias
Hi,
<TD ALIGN="CENTER" WIDTH="305" HEIGHT="203" STYLE="background-image: url(img/awh_wi.jpg)"> </TD>
.bild {
background-image: url(img/awh_wi.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
}
Warum meinst Du, daß unterschiedlicher CSS-Code (einmal eine Eigenschaft gesetzt, einmal 3) die gleiche Darstellung bewirken muß?
Du bist Dir der kompletten Auswirkungen von background-attachment:fixed bewußt (insbesondere die auf background-position)?
cu,
Andreas