スタイルシートで使用する色の指定方法です。

■HTMLと同じ指定方法

color: #FF0000 シャープ（ # ）で始まる6桁のカラーコードで指定
color: red redやgreen、whiteといったカラーネームで指定


■スタイルシート独自の指定方法

color: #F00 シャープ（ # ）で始まる3桁のカラーコードで指定
color: rgb(255,0,0) rgb( )による指定（0〜255）
color: rgb(100%,0%,0%) rgb( )による指定（0%〜100%）


<STYLE TYPE="text/css">
<!--

.red1 { color: #FF0000; }
.red2 { color: red; }
.red3 { color: #F00; }
.red4 { color: rgb(255,0,0); }
.red5 { color: rgb(100%,0%,0%); }

-->
</STYLE>



■シャープ（ # ）で始まる3桁のカラーコードで指定

3桁のカラーコードには、次のような意味があります。

#FFF

1桁目が赤、2桁目が緑、3桁目が青、という順番で並んでおり、この光の三原色を 0 〜 F までの16進数で指定して、色を調節します。

0 に近いほどその色は弱くなり、F に近いほどその色が強調されます。

#F00　■
#FFF　□
#000　■


■rgb( )による指定（0〜255）

rgb(255,255,255)

( ) の中に、赤、緑、青の色指定をカンマ（ , ）で区切って記述します。それぞれ 0 〜255 までの数値で指定して、色を調節します。

0 に近いほどその色は弱くなり、255 に近いほどその色が強調されます。

rgb(255,0,0)　■
rgb(255,255,255)　□
rgb(0,0,0)　■


■rgb( )による指定（0%〜100%）

rgb(100%,100%,100%)

( ) の中に、赤、緑、青の色指定をカンマ（ , ）で区切って記述します。それぞれ 0% 〜100% までの割合で指定して、色を調節します。

0% に近いほどその色は弱くなり、100% に近いほどその色が強調されます。

rgb(100%,0%,0%)　■
rgb(100%,100%,100%)　□
rgb(0%,0%,0%)　■


>>HOME