　色について

HTMLで色を指定するには、カラー名かRGB値(#RRGGBB)で指定しましたが、スタイルシートでは、この他にも色を指定する方法があります。

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

＃RRGGBB

HTMLでおなじみの色を指定する方法です。
R(赤)、G（緑）、B（青）の値を16進数（数字とA～F）をつかって、それぞれ2桁で指定します。理論上は、約1670万色表現できます。

＃RGB

R(赤)、G（緑）、B（青）の値を16進数（数字とA～F）をつかって、それぞれ1桁で指定します。理論上は、約4100色表現できます。

カラー名

これもHTMLでおなじみの色を指定する方法です。
redやblueなどのカラー名で指定します。
ブラウザによっては対応していないカラー名などもあります。

rgb(n,n,n)

R(赤)、G（緑）、B（青）の値を10進数（0～255）で指定します。
これも、#RRGGBBと同じく、理論上は、約1670万色表現できます。

rgb(n%,n%,n%)

赤、緑、青の各色の強さをパーセントで指定します。

これらの他にも、システムカラーを使って色を指定することも出来ます。システムカラーとは、WindowsやMacなどのOSによって管理されている色のことです。

これを使うと、ページを見ている人のOSの環境によって、異なる色を設定することが出来ます。

例えば、ページを見ている人のディスクトップの背景色が青色に設定されている場合、ページの背景色を同じ色の青色に、または、ディスクトップの背景色が緑色の場合は、ページの背景色を同じ色の緑色にすることなどが出来ます。

サンプル - Microsoft Internet Explorer

#ff0000は、赤色です

#f00も、赤色です

redも、赤色です

rgb(255,0,0)も、赤色です

rgb(100%,0%,0%)も、赤色です

HTML&CSS

<html>
<head>
<title>サンプル</title>
</head>
<body>
<h2 style="color:#ff0000">#ff0000は、赤色です</h2>
<h3 style="color:#f00">#f00も、赤色です</h3>
<p style="color:red">redも、赤色です</p>
<p style="color:rgb(255,0,0)">rgb(255,0,0)も、赤色です</p>
<div style="color:rgb(100%,0%,0%)">rgb(100%,0%,0%)も、赤色です</div>
</body>
</html>