CSS-relative URLs: Aus Stylesheet oder HTML-Dokument?

Relative URLs in CSS-Dateien: Eine Frage der relativen Position

Bei der Referenzierung von Assets wie Hintergrundbildern in einer CSS-Datei werden häufig relative URLs verwendet beschäftigt. Doch wo genau wird die relative URL gemessen?

Bedenken Sie den folgenden CSS-Code:

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

Wenn dieses Stylesheet über in verschiedene Dokumente eingebunden wird, ist das der relative URL innerhalb der CSS-Datei, ausgewertet relativ zu:

• Das Stylesheet-Dokument unter /stylesheets/?
• Das aktuelle Dokument Wo ist das Stylesheet enthalten?

Antwort:

Laut W3C werden „Teil-URLs relativ zur Quelle des Stylesheets interpretiert, nicht relativ.“ zum Dokument.“

Daher wird in diesem Fall die relative URL in der CSS-Datei relativ zum Stylesheet-Dokument unter interpretiert /stylesheets/.

Dies ist sinnvoll, da die CSS-Datei auf mehreren Seiten in verschiedenen Verzeichnissen verwendet werden kann. Durch die Standardisierung des relativen URL-Startpunkts in der CSS-Datei wird sichergestellt, dass die URLs unabhängig vom Speicherort der Seite korrekt funktionieren.

Das obige ist der detaillierte Inhalt vonCSS-relative URLs: Aus Stylesheet oder HTML-Dokument?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!