Externes Stylesheet funktioniert nicht

chuvak

Erfahrenes Mitglied
Ich möchte einer DIV-Box per CSS ein Hintergrundbild zuweisen. Eigentlich eine ganz einfache Aufgabe, die ich schon oft erledigt habe. Allerdings verzweifle ich diesmal daran:

HTML:
<html>
  <head>
    <title>div</title>
<!--<link rel="stylesheet" type="text/css" href="css/test.css" />-->

<style type="text/css">
.pin
{
  background-image : url("images/pin.gif");
  width : 150px;
  height : 150px;
  background-color: #cccccc;
}
</style>
  </head>
  <body>
    <div class="pin"></div>
    <img src="images/pin.gif" alt="Pin" />
  </body>
</html>
Wenn der Code auf einer Seite ist, funktioniert alles, wenn ich exakt den gleichen Code extern auslagere, verschwindet das Hintergrundbild. Nur die Hintergrundfarbe bleibt.
(Das Verzeichnis der ext. Datei stimmt, sonst wäre die Hintergrundfarbe nicht da).

Ich stehe echt auf dem Schlauch...
 
Hi,

wenn du die background-image-Eigenschaft aus der CSS-Datei im Unterverzeichnis "css" aufrufst, muß in der Pfadangabe zur Bilddatei auch die Verzeichnisebene entsprechend (nach oben) gewechselt werden, denn diese relative Angabe bezieht sich auf das Verzeichnis, in dem sich die Stylesheet-Datei befindet, und "images" ist deinem HTML-Quellcode zufolge kein Unterverzeichnis von "css".

CSS:
.pin
{
  background-image: url("../images/pin.gif");
  width: 150px;
  height: 150px;
  background-color: #cccccc;
}


mfg Maik
 
Falls du tatsächlich Hintergrundbild und Hintergrundfarbe kombinieren möchtest, steht dir hierfür die allgemeine background-Eigenschaft zur Verfügung, um darin diese Angaben zusammenzufassen ;)

CSS:
.pin
{
  background: url("../images/pin.gif") #ccc;
  width: 150px;
  height: 150px;
}

Angaben zu background-attachment, background-position u. background-repeat lassen sich darin ebenso notieren, sofern ein Hintergrundbild im Spiel ist.

mfg Maik
 
Zurück