色を指定する方法
HTMLやスタイルシートで背景や文字などの色を指定する場合、色名(カラーネーム)、または
「#rrggbb」という色指定値を使用します。
色名(カラーネーム)
色名を指定します。大文字・小文字のどちらでも可能です。
例)blue, red yellow
色指定値
赤(red)、緑(green)、青(blue)の3色より色を指定する方法です。
下のような指定方法があります。
- #rrggbb
"#ff0000"のように"#"をつけて、赤(red)、緑(green)、青(blue)のそれぞれの値を00〜ffの
16進数で2桁ずつ、計6桁で指定します。
(暗い) 00 → → → ff (明るい)
- #rgb
"#f00"のように"#"をつけて、赤(red)、緑(green)、青(blue)のそれぞれの値を0〜fの
16進数で1桁ずつ、計3桁で指定します。
"#f00"→"#ff0000"、"#f0c"→"#ff00cc"はそれぞれ同じ色になります。
(暗い) 0 → → → f (明るい)
- #rgb(n,n,n)
"rgb(255,0,0)"のように、rgbの()の中に、赤(red)、緑(green)、青(blue)のそれぞれの値を
0〜255の数字を","(カンマ)区切りで指定します。
(暗い) 0 → → → 255 (明るい)
- #rgb(n%,n%,n%)
"rgb(100%,0%,0%)"のように、rgbの()の中に、赤(red)、緑(green)、青(blue)のそれぞれの値を
","(カンマ)区切りで"%"(パーセント)で指定します。
上の#rgb(n,n,n)でいうと、0→0%、255→100%がそれぞれ同じ意味です。
(暗い) 0% → → → 100% (明るい)
一般的に、#rrggbb、#rgb(n,n,n)を使うことが多いです。
基本16色を指定すると下のようになります。
| #rrggbb | 色名 | #rgb(n,n,n)
|
| | #rrggbb | 色名 | #rgb(n,n,n)
#000080 | navy | rgb(0,0,128)
|
| #000000 | black | rgb(0,0,0)
|
#0000ff | blue | rgb(0,0,255)
|
| #808080 | gray | rgb(128,128,128)
|
#00ffff | aqua | rgb(0,255,255)
|
| #c0c0c0 | silver | rgb(192,192,192)
|
#008000 | green | rgb(0,128,0)
|
| #ffffff | white | rgb(255,255,255)
|
#00ff00 | lime | rgb(0,255,0)
|
| #800000 | maroon | rgb(128,0,0)
|
#ffff00 | yellow | rgb(255,255,0)
|
| #808000 | olive | rgb(128,128,0)
|
#ff0000 | red | rgb(255,0,0)
|
| #008080 | teal | rgb(0,128,128)
|
#ff00ff | fuchsia | rgb(255,0,255)
|
| | #800080 | purple | rgb(128,0,128)
| | | | | | | | | | | | | | | | |
関連する内容
色名サンプル
HTML講座
|
初心者講座
スポンサードリンク
HTML辞典
ページ
テキスト
文字
リスト
イメージ
リンク
テーブル
フレーム
|