【背景色】background-colorの使い方

background-colorとは？

要素の背景を指定したい時に使います。

background-color: ここに好きな色を指定します;

今回はlightblueをしてみます。

background-color: lightblue;

このように書きます。

色はカラーコードで指定することもできます。

background-color: #ADD8E6;

このように書くこともできます。

（#ADD8E6はlightblueです。）

そうするとこのようになります。

今回は左半分を白、右半分をピンクに指定してみます。

background:linear-gradient(90deg,white 0%,white 50%,pink 50%,pink 100%);

90deg＝これで90度に傾けさせます。

これを指定して左から右に色が変わるようにします。

white 0%,white 50%＝これで左から半分（50%）までが白色になります。

pink 50%,pink 100%＝これで半分から右側がピンク色になります。

するとこのように表示されます。