ga-05-d4

HTML/CSS初心者の為の
無料で挫折させない ホームページ作成講座

【 HTML/CSS逆引き辞典 】
覚えておくと便利なカラーネーム

覚えておくと便利なカラーネーム表を作りました。

画像

【サンプル コード】
HTMLコード
<html>
  <head>
    <title>カラーコード見本帳</title>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <div style="margin: 30px;">
    <table border="1" width="600" 
    cellspacing="0" cellpadding="5" 
    bordercolor="gray">
   
    
    <tr>
    <th height="50" bgcolor="white" 
    width="50"><font color="BLACK">赤</font></th>
    <th height="50" bgcolor="mistyrose" 
    width="100"><font color="BLACK">mistyrose</font></th>
    <th height="50" bgcolor="pink" 
    width="100"><font color="BLACK">pink</font></th>
    <th height="50" bgcolor="red" 
    width="100"><font color="white">red</font></th>
    <th height="50" bgcolor="white" 
    width="100"><font color="black">-----</font></th>
    <th height="50" bgcolor="white" 
    width="100"><font color="BLACK">------</font></th>
    </tr>

    <tr>
    <th height="50" bgcolor="white"
    width="50"><font color="BLACK">黄</font></th>
    <th height="50" bgcolor="lightyellow" 
    width="100"><font color="BLACK">lightyellow</font></th>
    <th height="50" bgcolor="yellow" 
    width="100"><font color="BLACK">yellow</font></th>
    <th height="50" bgcolor="gold" 
    width="100"><font color="BLACK">gold</font></th>
    <th height="50" bgcolor="orange" 
    width="100"><font color="BLACK">orange</font></th>
    <th height="50" bgcolor="tomato" 
    width="100"><font color="white">tomato</font></th>
    </tr>

    <tr>
    <th height="50" bgcolor="white" 
    width="50"><font color="BLACK">緑</font></th>
    <th height="50" bgcolor="lightgreen" 
    width="100"><font color="BLACK">lightgreen</font></th>
    <th height="50" bgcolor="limegreen" 
    width="100"><font color="BLACK">limegreen</font></th>
    <th height="50" bgcolor="green" 
    width="100"><font color="white">green</font></th>
    <th height="50" bgcolor="darkgreen" 
    width="100"><font color="white">darkgreen</font></th>
    <th height="50" bgcolor="white" 
    width="100"><font color="black">-----</font></th>
    </tr>      

    <th height="50" bgcolor="white" 
    width="50"><font color="BLACK">青</font></th>
    <th height="50" bgcolor="lightcyan" 
    width="100"><font color="BLACK">lightcyan</font></th>
    <th height="50" bgcolor="lightblue" 
    width="100"><font color="BLACK">lightblue</font></th>
    <th height="50" bgcolor="deepskyblue" 
    width="100"><font color="black">deepskyblue</font></th>
    <th height="50" bgcolor="blue" 
    width="100"><font color="white">blue</font></th>
    <th height="50" bgcolor="darkblue" 
    width="100"><font color="white">darkblue</font></th>
    </tr>
    

    <tr>
    <th height="50" bgcolor="white" 
    width="50"><font color="BLACK">白黒</font></th>
    <th height="50" bgcolor="white" 
    width="100"><font color="BLACK">white</font></th>
    <th height="50" bgcolor="whitesmoke" 
    width="100"><font color="BLACK">whitesmoke</font></th>
    <th height="50" bgcolor="lightgray" 
    width="100"><font color="BLACK">lightgray</font></th>
    <th height="50" bgcolor="gray" 
    width="100"><font color="white">gray</font></th>
    <th height="50" bgcolor="black" 
    width="100"><font color="white">black</font></th>
    </tr>
    </table>
  </div>
  </body>
</html>
              
 back
pagetop
 next

背景色(36色)
の使い方

覚えておくと便利な
カラーネーム

文字色を変更する

Copyright (c) 無料で挫折させないホームページ作成講座 All Rights Reserved.
by yorozuken