CSS ファイルと画像が異なるディレクトリにある場合、CSS で背景画像のパスを正しく指定するにはどうすればよいですか?

CSS での背景画像のパスの指定

CSS で背景画像を設定するには、ファイルのパスを指定する必要があります。次のクエリは、プロジェクトの組織構造を考慮して画像への正しいパスを見つけるという問題を解決することを目的としています。

問題:
ユーザーの CSS ファイルは Project/ にあります。 Web/Support/Styles/file.css、使用する予定の画像は Project/Web/images/image.png にあります。彼らは、background-image プロパティを設定するためにいくつかの方法を試みましたが、望ましい結果は得られませんでした。

解決策:
CSS で画像へのパスを正しく指定するには、相対CSS ファイルからのパスを考慮する必要があります。この場合、CSS ファイルは、images ディレクトリから 2 つ上のフォルダーにあります。したがって、パスには 2 つの ../ (親ディレクトリ) プレフィックスが必要です:

background-image: url('../../images/image.png');

2 つのディレクトリを上に移動することにより、CSS ファイルはプロジェクト構造内で画像を正しく見つけます。

以上がCSS ファイルと画像が異なるディレクトリにある場合、CSS で背景画像のパスを正しく指定するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。