HTML：色とカラーコード
色の名前
| 色 | 日本語 | 英語 | カラーコード | RGB |
|---|---|---|---|---|
| 黒 | black | #000000 | (0,0,0) | |
| 白 | white | #FFFFFF | (255,255,255) | |
| グレー | gray | #808080 | (128,128,128) | |
| 赤 | red | #FF0000 | (255,0,0) | |
| 緑 | green | #00FF00 | (0,255,0) | |
| 青 | blue | #0000FF | (0,0,255) | |
| 黄色 | yellow | #FFFF00 | (255,255,0) | |
| 水色 | cyan | #00FFFF | (0,255,255) | |
| 赤紫色 | magenta | #FF00FF | (255,0,255) |
これ以外はHTML色見本で調べよう。
スタイルシートでの設定のしかた
color で 文字の色 を、background-color で 背景色 を変えられます。
<style> h1{color:red; background-color:silver;}</style>カラーコード
色は、 「光の三原色」 と呼ばれる、 赤 と 緑 と 青 を組み合わせて作ります。これを数字で表現したのが カラーコード です。カラーコードを使うと英語で書くよりもたくさんの色を出せます。
カラーコードは #と6ケタ数字 で表します。数字６ケタのうち、最初の2ケタが 赤 を、次の２ケタが 緑 を、最後の２ケタが 青 を表します。
２ケタの数字は、 00 から FF まであります。 00 がなしということで、 FF が最大ということです。
| 暗い | 中間 | 明るい | ||||||||
|---|---|---|---|---|---|---|---|---|---|---|
| 00 | 01 | 02 | ・・ | 99 | A0 | A1 | ・・ | FD | FE | FF |
なので、
#000000 は赤の光も緑の光も青の光もない状態、つまり真っ暗な 黒 になります。
逆に、 #FFFFFF は赤の光も緑の光も青の光も全部光っている状態、すごく明るい昼のような 白 になります。
#FF0000 これは、赤い光が全開なのでそのまま 赤 になります。
では、 #880000 これはどうなるでしょう？赤い光が半分くらいなので、ちょっと暗い赤、つまり 茶色 になります。
#FFFF00 の場合、赤い光と緑の光が全開です。赤と緑を混ぜるとどうなりましたっけ？そうです。 黄色 になります。
ほかにもどんな色ができるか、いろいろやってみましょう！
カラーコードを使った色の指定例
<style> h2{color:#FF0022}</style>