ＣＳＳで色を指定するには、大きく分けて二つの方法があります。一つは「black」や「white」などのキーワード、もう一つは、#fffなどの数値です。

まず、キーワードによる色の指定ですが、

black(#000000)
gray(#808080)
silver(#c0c0c0)
white(#ffffff)
navy(#000080)
teal(#008080)
aqua(#00ffff)
blue(#0000ff)
olive(#808000)
green(#008000)
lime(#00ff00)
yellow(#ffff00)
maroon(#800000)
purple(#800080)
fuchsia(#ff00ff)
red(#ff0000)

の16種類があります。

次に数値での指定ですが、これはHTMLと同じ方法で#に続いて、RGB各色の値を２桁ずつの16進数で指定します。合計すると約1,677万色の中から一つが選べる計算になります。
しかし、指定できるからといってやたらめったらこれを複雑に使いまくってもＯＳやモニターによって同時に表示できる色数に制限があるので必ずしもみんながみんな同じ色で見えているわけではありません。Webの場合は色に関してかなりあいまいで紙媒体のかたがたの苦労は相当なものでしょう。。。しかし、Webだからと言ってあまえたり、ないがしろにするのはよくありません。
そこで登場するのがWebセーフカラーなるものです。これを全部書いていたら結構あるので別の機会で紹介するかWebセーフカラーで検索してみてください。

または、DreamWeaverでCSSの色指定をすると、Webセーフカラーで指定ができます。後、Illustrator、Photoshopなどで、色を指定するときにWebセーフカラーのみに制限のチェックを入れるとWebセーフカラーのみになります。
そんなこんなでWebセーフカラーが選択できますが、実はこれでも完璧に同じになるわけではありません。しかし、やみくもに色指定をするよりか、はずれは少なくなるので、なるべくWebセーフカラーを使ってサイトを構築することを心がけましょう。

その16進数での指定の仕方ですが、実は最初の方でこっそり使いました！６桁ではなく３桁で指定する方法があります。

それは、#AABBCCなど二つ並べた２桁が同じ値であれば、#ABCと指定しても同じものとして解釈してくれます。これは、Webセーフカラーを指定するときには大変便利なので覚えておきましょう。

後、あまり一般的ではありませんが、RGBで指定する方法もありま

例えば赤でいくと
rgb(255,0,0)

っと指定すると赤になります。

更に、値に%を使った方法もあります。

もう一回赤で行くと、
rgb(100%,0%,0%)と指定ができます。

ＲＧＢとは、コンピューターの赤（Ｒ）緑（Ｇ）青（Ｂ）の３つの色の組み合わせで色を表現する方法で光の三原色と呼ばれています。

« 前の記事

次の記事 »