文字色のプロパティ
【構文】color: 色名または色コード;
文字色を指定するプロパティはcolorプロパティです。フォントに関するプロパティですが、「font-color」ではないので注意しましょう。
See the Pen
2-7_1 by Koji Seto (@yseseto)
on CodePen.
背景色のプロパティ
【構文】 background-color: 色名または色コード;
背景色はbackground-colorプロパティで指定します。色の指定方法は文字色と同様です。
See the Pen
2-7_2 by Koji Seto (@yseseto)
on CodePen.
色の指定方法
【構文】
ColorName (カラーネーム)
#RRGGBB / #RGB (16進コード)
rgb(Red, Green, Blue) / rgba(Red, Green, Blue, Alpha) (10進コード)
カラーネームによる指定は、色名を英語で指定する方法です。たくさんありますので、気になる人は調べてみてください。
16進数によるコード指定は、最もよく使われる方法です。16進数(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F) 2桁ずつ、合計6桁で光の3原色の赤、緑、青の値を指定する方法となります。
各色256段階の指定ができるため、約1,677万色の指定ができますが、特に(00, 33, 66, 99, CC, FF)のみを使用したコードを「Webセーフカラー」と呼び、かつてモニタの表示できる色数が少なかった時代に、安全に使用できる色としてこう呼ばれていました。大まかな色指定をしたい場合にはこのWebセーフカラー216色がよく使われます。また省略して各色16進数1桁ずつの計3桁でも指定できます。
最後に10進数によるコード指定ですが、10進数(0〜255)をカンマで区切って指定します。考え方は16進数と同じですが、rgba()は最後に不透明度(アルファ)を0〜1の範囲で指定できます(0は0%、1は100%)。半透明色で塗りつぶしたいときに使用します。