【HTMLとCSS】色の変更RGBとRGBA〜文字色や背景色の変更〜

文字の色やを変える方法はいくつかあります。

基本はcolorプロパティでカラーコードや色の名前を指定し、変更します。

他にも「RGB」と「RGBA」で色を指定することができます。

それぞれの使い方を見ていきましょう。

RGB

RGBのRRedGGreenBBlueというように3色の組み合わせで色が決まります。

実際に文字色を指定してみましょう。

rgb(数値, 数値, 数値)

背景色に使う場合はこのように書きます。

background-color: rgb(0, 0, 255);

この色は、赤が0、緑が0、青が255なので青色になります。

RGBA

RGBの使い方は先ほどの通りですが、他にRGBAがあります。

RGBにAかプラスされましたが、Aはアルファチャンネルで、透明値を指定します。

RGBを透明にさせるのがRGBAになります。

rgba(数値, 数値, 数値, 数値)

先ほどの青色を透明にしてみましょう。

background-color: rgb(0, 0, 255, 0.5);

ちょっとわかりにくいのですが、先ほどのrgb(0, 0, 255)を0.5(50%)透明にしました。