<font> タグは、 文字の大きさや色、文字のフォントを変更するためのタグ です。
たとえば、文字の大きさを変更するためには、下記のように <font> タグを使います。
■ <font> タグで、文字の大きさを変更するときの記述例
<font size="1">ホームページに掲載する文章</font>
<font size="3">ホームページに掲載する文章</font>
<font size="5">ホームページに掲載する文章</font>
|
■ ホームページ上の表示
ホームページに掲載する文章
ホームページに掲載する文章
ホームページに掲載する文章
|
上記のように、<font> タグを使うことで、 文字の大きさ を変更することができます。
なお、size で数字を指定していますが、「1」 が一番小さな文字で、「7」 が一番大きな文字です。
この数字部分を変更することで、文字の大きさを、7段階で調整することができます。
これが、<font> タグを使った、「文字の大きさ」の変更方法です。
そして、<font> タグは、 文字の色を変更すること もできます。
文字の色を変更するためには、下記のように、<font> タグを使います。
■ <font> タグで、文字の色を変更する記述例
<font color="red">ホームページに掲載する文章</font>
<font color="#ff0000">ホームページに掲載する文章</font>
|
■ ホームページ上の表示
ホームページに掲載する文章
ホームページに掲載する文章
|
上記のように、<font> タグの後ろの color で、文字の色を指定することができます。
なお、色の指定方法は、大きく分けて2つの方法があります。
1つ目は、 red や green 、 white などの カラーネームで色を指定する方法 です。
そして2つ目は、 シャープ(#)+6桁の英数字で、色を指定する方法 になります。
たとえば、上記の例で言うと、 color="red" という形で、「red」 を指定すると、文字が赤くなっていますよね?
このように、red や green 、 white などの カラーネームで、色を指定することができます。
また、 color="#ff0000" という形で指定しても、文字が赤くなっていますよね?
このような、 シャープ(#)+6桁の英数字のことをカラーコード と言って、このような 「カラーコード」 で、文字の色を指定することもできます。
ちなみに、red や green 、 white などの カラーネームには分かりやすいというメリット があって、
シャープ(#)+6桁の英数字の カラーコードは、色をとても細かく指定することができるというメリット があります。
そのため、僕の場合は、基本的には分かりやすい 「カラーネーム」 を使って、色を細かく指定したいときは 「カラーコード」 を使っています。
なお、この色の指定方法については、ホームページの色の指定方法(配色)について で、詳しくお伝えしていますので、確認してみてください。
また、<font> タグについては、文字の色やサイズを変更する方法と段落を作成する方法 でお伝えしていますので、合わせて確認してみてくださいね。
これが、<font> タグを使った、「文字の色」の変更方法です。
そして最後に、<font> タグは、 文字のフォントを変更すること もできます。
文字のフォントを変更するためには、下記のように、<font> タグを使います。
■ <font> タグで、文字のフォントを変更する記述例
<font face="MS 明朝">ホームページに掲載する文章</font>
<font face="MS ゴシック">ホームページに掲載する文章</font>
<font face="HG行書体">ホームページに掲載する文章</font>
<font face="Comic Sans MS">ホームページに掲載する文章</font>
|
■ ホームページ上の表示
ホームページに掲載する文章
ホームページに掲載する文章
ホームページに掲載する文章
ホームページに掲載する文章
|
上記のように、<font> タグの後ろの face で、文字のフォントを指定することができます。
なお、指定できるフォントの種類は、「MS 明朝」や「MS ゴシック」、「HG行書体」や「Comic Sans MS」などがあります。
これについては、お好きなフォントをお選びくださいね。
なお、ここでお伝えしたことは、まとめて書くこともできます。
たとえば、「文字サイズを大きくして、赤字にして、フォントはMS 明朝にしたい」という場合は、下記のように記述します。
■ <font> タグで、文字の大きさと色とフォントを変更する記述例
<font size="5" color="red" face="MS 明朝">ホームページに掲載する文章</font>
|
■ ホームページ上の表示
ぜひ活用してくださいね!