文字の大きさと色


ここで学習するエレメント
FONTエレメント、BIGエレメント、SMALLエレメント


文字の大きさを指定する

特定の文字を大きく表示したり、色を変えたりするには、どうすればよいでしょうか?
FONTエレメントを使います。以下のように記述してみてください。

+---------
<BODY>
<H1>見出し1</H1>
<P>HTML研修<BR>
<FONT SIZE="1">極小文字</FONT><BR>
<FONT SIZE="7">極大文字</FONT></P>
</BODY>
+---------

ブラウザで参照すると、以下のように表示されます。

+---------

見出し1

HTML研修
極小文字
極大文字

+---------

<FONT SIZE="n">のnの部分に1〜7までの数字を入れて大きさを決定します。1が最小で、7が最大です。なお、通常本文の標準サイズは「4」です。
また、以下のような書き方も出来ます。

<FONT SIZE="+1">
<FONT SIZE="-1">

これは、相対的にサイズを変える方法です。
また、BIGエレメントは、<FONT SIZE="+1">と同じ意味を持ちます。
SMALLエレメントは、<FONT SIZE="-1">と同じ意味を持ちます。
極力、BIGエレメントとSMALLエレメントを使いましょう。

+---------
<BODY>
<H1>見出し1</H1>
<P>HTML研修<BR>
<SMALL>SMALLもじ</SMALL><BR>
<BIG>BIGもじ</BIG></P>
</BODY>
+---------

ブラウザで参照すると、以下のように表示されます。

+---------

見出し1

HTML研修
SMALLもじ
BIGもじ

+---------


文字の色を指定する

色をつける場合もFONTエレメントを使います。
以下のように記述してみてください。

+---------
<BODY>
<H1>見出し1</H1>
<P>HTML研修<BR>
<FONT COLOR="#FF0000">赤文字</FONT><BR>
<FONT COLOR="#00FF00">青文字</FONT></P>
</BODY>
+---------

ブラウザで参照すると、以下のように表示されます。

+---------

見出し1

HTML研修
赤文字
青文字

+---------

この「COLOR="#RRGGBB"」のRRGGBB部分の数値を変更すれば、いろいろな色を作り出せます。色要素RGBを2バイトづつ16進数で表現して色を混ぜ合わせます。
例えば、赤は「#FF0000」、緑は「#00FF00」、青は「#0000FF」になります。

RGB要素の憶え方は、

  R  G  B
  e  r  l
  d  e  u
     e  e
     n

です。分かりましたか?

また、<FONT COLOR="#RRGGBB">と<FONT SIZE="n">は、同時に使用できます。<FONT SIZE="n" COLOR="#RRGGBB">と記述します。


次へ進む
前に戻る