CSS 相対 URL: スタイルシートまたは HTML ドキュメントに相対しますか?

CSS 相対 URL: スタイルシートまたは現在のドキュメントに相対しますか?

背景画像など、CSS ファイル内で相対 URL を指定する場合、彼らが言及している場所を理解することが重要です。ファイル「/stylesheets/base-styles.css」から次の例を取り出します:

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

次に、このスタイルシートを /item/details.html や /about/index.html などのさまざまなドキュメントに含めることを検討してください。 CSS ファイル内の相対 URL はどこで相対的に評価されますか?

回答:

W3 によると、「部分 URL はスタイルのソースを基準にして解釈されます」ドキュメントに関連するものではなく、シートです。」したがって、この場合、URL はスタイルシートの場所 (「/stylesheets/」) に対して相対的に評価されます。

CSS ファイルが異なるディレクトリ内のページにリンクされている可能性があるため、これは当然のことです。 CSS ファイルの場所に対する URL 評価を標準化することで、スタイルシートが含まれるページ コンテキストに関係なく、URL が正しく解決されることが保証されます。

以上がCSS 相対 URL: スタイルシートまたは HTML ドキュメントに相対しますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。