ゼロからはじめるホームページ作成 
HOME > HTML講座 > 色を指定する方法

色を指定する方法

HTMLやスタイルシートで背景や文字などの色を指定する場合、色名(カラーネーム)、または
「#rrggbb」という色指定値を使用します。

色名(カラーネーム)

色名を指定します。大文字・小文字のどちらでも可能です。
例)blue, red yellow

色指定値

赤(red)、緑(green)、青(blue)の3色より色を指定する方法です。
下のような指定方法があります。
  1. #rrggbb
    "#ff0000"のように"#"をつけて、赤(red)、緑(green)、青(blue)のそれぞれの値を00〜ffの
    16進数で2桁ずつ、計6桁で指定します。
    (暗い) 00 → → → ff (明るい)
  2. #rgb
    "#f00"のように"#"をつけて、赤(red)、緑(green)、青(blue)のそれぞれの値を0〜fの
    16進数で1桁ずつ、計3桁で指定します。
    "#f00"→"#ff0000"、"#f0c"→"#ff00cc"はそれぞれ同じ色になります。
    (暗い) 0 → → → f (明るい)
  3. #rgb(n,n,n)
    "rgb(255,0,0)"のように、rgbの()の中に、赤(red)、緑(green)、青(blue)のそれぞれの値を
    0〜255の数字を","(カンマ)区切りで指定します。
    (暗い) 0 → → → 255 (明るい)
  4. #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)
#000080navyrgb(0,0,128)
#000000blackrgb(0,0,0)
#0000ffbluergb(0,0,255)
#808080grayrgb(128,128,128)
#00ffffaquargb(0,255,255)
#c0c0c0silverrgb(192,192,192)
#008000greenrgb(0,128,0)
#ffffffwhitergb(255,255,255)
#00ff00limergb(0,255,0)
#800000maroonrgb(128,0,0)
#ffff00yellowrgb(255,255,0)
#808000olivergb(128,128,0)
#ff0000redrgb(255,0,0)
#008080tealrgb(0,128,128)
#ff00fffuchsiargb(255,0,255)
#800080purplergb(128,0,128)


関連する内容

  • 色名サンプル



  • HTML講座

    初心者講座

    スポンサードリンク

    HTML辞典

    ページ
    テキスト
    文字
    リスト
    イメージ
    リンク
    テーブル
    フレーム



    Copyright© ゼロからはじめるホームページ作成講座 All Rights Reserved.  サイトマップ