CSS-relative URLs: Relativ zu Stylesheet oder HTML-Dokument?

Relative CSS-URLs: Relativ zum Stylesheet oder zum aktuellen Dokument?

Bei der Angabe relativer URLs in CSS-Dateien, z. B. für Hintergrundbilder, ist dies der Fall Es ist wichtig, den Ort zu verstehen, auf den sie sich beziehen. Nehmen Sie dieses Beispiel aus der Datei „/stylesheets/base-styles.css“:

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

Nun überlegen Sie, dieses Stylesheet in verschiedene Dokumente wie /item/details.html oder /about/index.html einzubinden. Wo wird die relative URL in der CSS-Datei relativ zu ausgewertet?

Antwort:

Laut W3 werden „Teil-URLs relativ zur Quelle des Stils interpretiert.“ Blatt, nicht relativ zum Dokument. Daher wird in diesem Fall die URL relativ zum Speicherort des Stylesheets ausgewertet, der „/stylesheets/“ ist.

Dies ist sinnvoll, da die CSS-Datei möglicherweise mit Seiten in anderen Verzeichnissen verknüpft sein könnte. Durch die Standardisierung der URL-Auswertung auf den Speicherort der CSS-Datei wird sichergestellt, dass die URLs unabhängig vom Seitenkontext, in dem das Stylesheet enthalten ist, korrekt aufgelöst werden.

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