画面サイズいっぱいに
画像を背景画像として表示させ、
その上にテキストを表示させてます

画像を表示させるには

<img src="cat.jpg">
こんなかんじで画像を呼び出して書く書き方がありますが背景画像にする方法もあります。

これは画像は背景画像で指定してます。画像は背景なので上に文字を乗せることもできます。

こんなかんじ

CSS でこんな感じで指定します。

background-image: url(cat.jpg);

これは画像は背景画像で指定してます。画像は背景なので上に画像を乗せることもできます。

画像ファイルはPNGは透過できるので切り抜きできるで。

背景画像はパターンとして設定もできます。

これの表示を繰り返すと

CSS でこんな感じで指定します。

background-repeat: repeat;

横だけ繰り返しとか

background-repeat:repeat-x;

縦だけ繰り返しとかできます。

background-repeat:repeat-y;

背景なんで上に画像やテキストが乗るよ

ぎゃー

GIFは手軽にアニメーションを設定できるよ

背景画像を使いこなすと簡単に重なりを作れるので便利!

それから、背景画像は入れ子になった要素ごとに設定できるので、複数重ね合わせることができるよ!