background-imageで背景画像を指定する【CSS】

background-imageは要素の背景画像を指定するプロパティです。

noneを指定すると背景画像は指定されません。

背景画像を指定するときは、url(‘画像のURL’)という形で記述し、括弧内に背景画像にしたいURLを指定します。

画像はカンマ（,）で区切って複数指定することもでき、その場合は先に指定した画像が前面に配置され、後に指定した画像が背面に配置されます。

上の例ではテキストの色は黒なんですけど、たとえば背景の画像をもっと色の濃い画像にして、テキストの色を白にしたとします。

その場合、もしブラウザ環境などによって背景画像が読み込めなかったり、読み込みに時間がかかってしまうと、テキストの色が白だと読めなくなりますよね。

そういったケースを想定して、background-colorプロパティも使って、背景に濃い色を同時に指定しておいてください。

関連記事
『background-colorで背景色を指定する【CSS】』