Ist ein relativer Pfad in einer CSS-Datei relativ zur CSS-Datei?


70

Wenn ich ein Bild oder eine andere Datei in einer CSS-Datei über einen relativen Pfad referenziere, ist der Pfad relativ zur CSS-Datei oder zur HTML-Datei unter Verwendung der CSS-Datei?

Antworten:


86

Ja, es ist relativ zu .css

Hier ist ein Beispiellayout:

Page:  page.htm ... does not matter where
CSS:   /resources/css/styles.css  
Image: /resources/images/image.jpg

CSS in styles.css:

div { background-image: url('../images/image.jpg');

Vielen Dank für die ausführliche Antwort. Ich war in der gleichen Ausgabe wirklich verwirrt, und hier haben Sie es einfach besser gelöst.
AbdulAziz

3
Dies ist in der Tat sinnvoll, da damit dieselbe .css Datei aus verschiedenen .htmlDateien (die sich möglicherweise an verschiedenen Orten befinden) referenziert werden kann, ohne die Pfade zu externen Objekten zu bremsen.
Davide

Warum ist die Klammer für div in styles.css nicht geschlossen?
Suleman

8

Ja. Es ist relativ zur CSS-Datei. Ich werde hinzufügen, dass dies auch relativ zu der Domäne umfasst, in der sich die CSS-Datei befindet.

Wenn also auf das CSS verwiesen wird als:

<link href="http://www.otherdomain.com/css/example.css" type="text/css" rel="stylesheet" />

und es enthält:

div { background-image: url('/images/image.jpg');

Der Hintergrund wird sein:

http://www.otherdomain.com/images/image.jpg


2
Das Include von einer externen Domain funktioniert in einigen Browsern nur, wenn Sie den Header so eingestellt haben, dass externe Includes aufgrund derselben Ursprungsrichtlinie zulässig sind
Jakob Alexander Eichler,


Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.