初めに学習するCSSは、テキストの文字の色を変更する「color」プロパティです。 colorの値に色を指定することで文字色を変更することができ、 色の指定方法は主に、キーワード指定、カラーコード指定が使われています。 それでは実践問題を通して学習していきましょう!

colorプロパティとは

colorプロパティとは、要素のテキストの文字色を変えることのできるCSSのプロパティです。
要素の色を設定するプロパティは他にもbackground-color（背景色）、 border-color（境界色）、 outline-color（輪郭色） などが用意されており、今回使用するcolorプロパティは「文字色」を設定します。
変更したい箇所に合わせてプロパティを使い分けられるようにしておきましょう。

colorの使い方

colorプロパティを使った色の指定方法には、"blue"や"red"といったキーワードで指定する方法や、
"#" の後に R（赤）G（緑）B（青）の光の3原色をそれぞれ2桁の16進数で表した数値を並べた #rrggbb 形式で指定する方法、
Hue（色相）、Saturation（彩度）、Lightness（輝度）をそれぞれ0～360の数値で指定して色を決める方法があります。

一般的によく使われているのが16進数のRGB形式で指定する方法になります。
RGB形式は、赤緑青の3原色を0～255の数値で調整できることから、細かい色の設定を行なえます。

また、色を白にしたい場合はrgb(225,225,225)で設定し、黒の場合はrgb(0,0,0)とすることで表現できます。

あらかじめエディタに書くコード

                    <p class="text">ninjacode<span>プログラミング学習</span></p>
¥HTML¥
                

期待する画面