HTML編 12/51
| 目的別 index | タグ別 index | カラーチャート | images | SAMPLE |
文字を表示する
文字に色を付ける
書体を指定する




文字に色を付ける

●<FONT COLOR="n">
タイトル「Kimura's Room」に色を付けてみましょう。文字に色を付けるにはFONTタグに続けてCOLORオプションとパラメータを書き込みます。先ほどやったSIZE=nと同じ要領です。また色指定のパラメータはBODYタグに指定したやり方と同じですので、もう難しくはないと思います。色は上の「カラーチャート」を参考にして下さい。タイトルを緑にします。

<FONT SIZE="7" COLOR="#009900"><B><I>Kimura's Room</I></B></FONT>

下の「◆」に一つずつそれぞれ色を付ければ、ちょっとしたアクセントになります。少しめんどくさいかも知れませんが…(笑)。
View
<HTML>
<HEAD>
<TITLE>ようこそ!Kimura's Roomへ</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=Shift_JIS">
</HEAD>
<BODY BGCOLOR="#ececec">
<H2>ようこそ!</H2>
<FONT SIZE="7"
COLOR="#009900"><B><I>Kimura's Room</I></B></FONT><BR>
<FONT SIZE="2" COLOR="#0000ff">◆</FONT>
<FONT SIZE="2" COLOR="#3300ff">◆</FONT>
<FONT SIZE="2" COLOR="#6600ff">◆</FONT>
<FONT SIZE="2" COLOR="#9900ff">◆</FONT>
<FONT SIZE="2" COLOR="#cc00ff">◆</FONT>
<FONT SIZE="2" COLOR="#ff00ff">◆</FONT>
<FONT SIZE="2" COLOR="#ff00cc">◆</FONT>
<FONT SIZE="2" COLOR="#ff0099">◆</FONT>
<FONT SIZE="2" COLOR="#ff0066">◆</FONT>
<FONT SIZE="2" COLOR="#ff0033">◆</FONT>
<FONT SIZE="2" COLOR="#ff0000">◆</FONT>
</BODY>
</HTML>




書体を指定する

●<FONT FACE="n,n,n">
FONTタグにFACEオプションを加えることで書体指定もできますが、これは見る人のコンピュータにその書体が入って無ければ意味がありません。そこでWindows、Macintosh、UNIXの一般的な書体をいくつか羅列しておいて、どれかに当たることを祈ります(笑)。パラメータの中に書体名を書き込み、それぞれ「,」で区切ります。左に書いた順にある書体で表示されます。もし、どれも無かった場合は、デフォルトの文字になりますので、「ここはこの書体で」とあまりこだわらずに作りましょう。ヒットしたらラッキーくらいの気持ちで使ってください。
タイトルに「Times」を指定してみます。ちゃんと表示されてますか?
View
<HTML>
<HEAD>
<TITLE>ようこそ!Kimura's Roomへ</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=Shift_JIS">
</HEAD>
<BODY BGCOLOR="#ececec">
<H2>ようこそ!</H2>
<FONT SIZE="7" COLOR="#009900"
FACE="Times New,Times,Times Roman"><B><I>Kimura's Room</I></B></FONT><BR>
<FONT SIZE="2" COLOR="#0000ff">◆</FONT>
<FONT SIZE="2" COLOR="#3300ff">◆</FONT>
<FONT SIZE="2" COLOR="#6600ff">◆</FONT>
<FONT SIZE="2" COLOR="#9900ff">◆</FONT>
<FONT SIZE="2" COLOR="#cc00ff">◆</FONT>
<FONT SIZE="2" COLOR="#ff00ff">◆</FONT>
<FONT SIZE="2" COLOR="#ff00cc">◆</FONT>
<FONT SIZE="2" COLOR="#ff0099">◆</FONT>
<FONT SIZE="2" COLOR="#ff0066">◆</FONT>
<FONT SIZE="2" COLOR="#ff0033">◆</FONT>
<FONT SIZE="2" COLOR="#ff0000">◆</FONT>
</BODY>
</HTML>

backindexnext