CSSメモ

読み込み中の背景色 ページ12

##

みなさんは背景に、
色 と 画像 を同時に設定できることを知っていますか？

実は、両方設定できるんです！

とはいっても、色の上に画像がのっている感じになるので、実際は画像が見える形になります。

意味がないように思うかもしれませんが、この２つは読み込み速度がかなり違います。
画像より色の方が読み込みが早いので、
{
background-color:#カラーコード;
background-image:url(画像URL);
}
というふうに設定すると、画像が読み込まれるまでの間、カラーコードの色が背景になります。
せっかくきれいなCSSでも、読み込みの間がデフォルト画像だとちょっとガッカリ、なんてこともあるので、背景画像に近い色を設定しておくといいでしょう。

ちなみに、この２つはまとめて、
{
background:#カラーコード url(画像URL);
}
とかくこともできます。
このようなものをショートハンドプロパティ、と言います。
実は「border」もショートハンドプロパティです。
慣れてくると便利なので、興味があったらぜひ調べてみてくださいねー。

##

CSSの長さ→←CSSの読み込みを早くする

→ 目次へ｜作品を作る｜感想を書く
他の作品を探す