CSS url()

CSS url()関数の操作方法を学ぶ

背景画像について話すとき、@import、など、url()リソースをロードする関数:

div {
  background-image: url(test.png);
}

この場合、CSSファイルが定義されているフォルダー内のファイルを検索する相対URLを使用しました。

私は1レベル戻ることができました

div {
  background-image: url(../test.png);
}

またはフォルダに移動します

div {
  background-image: url(subfolder/test.png);
}

または、CSSがホストされているドメインのルートからファイルをロードすることもできます。

div {
  background-image: url(/test.png);
}

または、絶対URLを使用して外部リソースをロードすることもできます。

div {
  background-image: url(https://mysite.com/test.png);
}

私の無料ダウンロードCSSハンドブック


その他のCSSチュートリアル: