ホームページ作成/ホームページ作成関連情報

初心者応援講座 掲示板書き込み向け 簡単HTML(3ページ目)

HTMLタグが利用可能な掲示板などで文字を装飾する際などに活用できる、簡単なHTMLの記述方法をご紹介。レンタル日記スペース上で文字を装飾する際などにも活用できるでしょう。

西村 文宏

執筆者:西村 文宏

ホームページ作成ガイド


文字の表示色を変えたい

※HTMLタグの使用が許可されている掲示板なら、FONTタグは使用できる場合が多いでしょう。 ですが、書き込む前に「ヘルプ」などで本当に使えるかどうか確認することをお忘れなく。 背景色と似たような色だと、非常に読みにくくなる可能性があります。掲示板で使う場合は、どんな色で表示されるのかよく考えた上で書き込みましょう。

<FONT COLOR="?"> 文字色を変更するときに使用

次に、文字色を変える方法を見ていきましょう。
上段がHTMLの記述方法、下段がその表示のされ方です。

◆色名で指定する
●記述
<font color="blue">これは青色</font>
<font color="red">これは赤色</font>
<font color="green">これは緑色</font>
●見え方
これは青色 これは赤色 これは緑色

「color=」の後に、色の名前を英語で指定します。分かりやすい指定方法ですね。
※大文字・小文字は関係ありません。混在も可です。

色は、
  • Black
  • Gray
  • Silver
  • White
  • Red
  • Maroon
  • Purple
  • Fuchsia
  • Green
  • Lime
  • Olive
  • Yellow
  • Aqua
  • Teal
  • Blue
  • Navy
…の16色が定義されています。
※これらの16色は、比較的古いブラウザでも表示可能です。

HTMLで定義されているのは上記の16色ですが、多くのブラウザでは、
  • Brown
  • Crimson
  • IndianRed
  • Chocolate
  • Tomato
  • Coral
  • SandyBrown
  • Orange
  • Gold
  • Khaki
  • Pink
  • AntiqueWhite
  • Indigo
  • DarkBlue
  • MediumBlue
  • RoyalBlue
  • SteelBlue
  • Skyblue
  • Turquoise
  • DarkCyan
  • ForestGreen
  • DarkGreen
  • SpringGreen
  • Yellowgreen
  • BlueViolet
  • DarkViolet
  • Magenta
  • HotPink
  • Orchid
  • Violet
  • Lavender
  • Gainsboro
  • Lightgrey
  • DarkGray
  • Slategray
  • Dimgray
  • …など、その他の色名でも表示できます
    ※HTMLで定義されているわけではないので、この色名では表示できないブラウザもあります。


    ◆使用例
    ●記述
    とっても重要なところは<font color="red">赤色で表示</font>してみたり、どうでもいいところは<font color="gray">灰色で表示</font>してみたり…。
    ●見え方
    とっても重要なところは赤色で表示してみたり、どうでもいいところは灰色で表示してみたり…。
    ※全てのアクセス者が色を見ることができるとは限らないので、重要な箇所を示したい場合は、<em>や<strong>といったタグを利用するべきですが、 ここでは入門向けに話を簡単にするために、その点は省略します。

    すべてのアクセス者が、必ずしも色を(製作者の意図通り)に見られる環境にあるとは限りませんので、 望みの色とは異なる色で表示されても問題ないような使い方にとどめておきましょう。

    なお、色は数値で指定する方法もあります。

    ◆数値で指定する
    ●記述
    <font color="#32cd32">これはライムグリーン</font>
    ●見え方
    これはライムグリーン

    「color=」の後に、色を16進数の数値で指定する方法です。
    こちらの方が色を頭で想像しやすいため、慣れればこちらの指定の方が便利でしょうが、 最初からこちらを説明すると混乱するかも知れませんので、今回は省略します。


    毎週水曜日に発行中。 メールマガジン上でしか読めない豆知識なども連載。 ご購読は無料。みなさんのご登録をお待ちいたしております。
    登録・バックナンバーの閲覧はこちら
    ●メールマガジン発行中
    • 前のページへ
    • 1
    • 2
    • 3
    • 4
    • 5
    • 次のページへ

    あわせて読みたい

    あなたにオススメ

      表示について

      カテゴリー一覧

      All Aboutサービス・メディア

      All About公式SNS
      日々の生活や仕事を楽しむための情報を毎日お届けします。
      公式SNS一覧
      © All About, Inc. All rights reserved. 掲載の記事・写真・イラストなど、すべてのコンテンツの無断複写・転載・公衆送信等を禁じます