構文

<p>・・・<font>・・・</font>・・・</p>

説明文

　<font>タグは，<font>?</font>で囲まれた文字のフォントの種類やサイズ，色などを指定する。

　しかし，HTML 4 Strictからは，HTMLは文書構造のみを記述し，見栄えやデザインについてはスタイル・シートで指定を行うことを推奨したことから，フォントの見栄えを指定する<font>タグを非推奨としています。そのため，フォントの設定についてはスタイル・シートの「font」，「font-size」，「font-style」，「color」などで指定する。

　<font>タグはインライン要素であるため，基本的にブロック要素の中で利用するようにする。

サンプル

HTMLソース

<p>　今日，友人から小包が届いた。中には「<font size="5">大きなりんご
</font>」と「<font size="-2">小さなぶどう</font>」が入っていた。</p>
<p>　りんごは<font color="red">非常に赤々</font>しており
<font size="5" font-weight="700">とてもおいし
そう</font>である。</p>

ブラウザ表示例

　今日，友人から小包が届いた。中には「大きなりんご」と「小さなぶどう」が入っていた。

　りんごは非常に赤々しておりとてもおいしそうである。

対応状況

HTML IE Firefox Opera
4 strict 4 Transitional 5 6 7 2 3 8 9
× ○ × ○ ○ ○ ○ ○ ○

要素，タグ

タグ要素 インライン要素
包括可能要素 インライン要素
タグ記述条件 開始タグ：必須　終了タグ：必須

属性

よく利用する属性

属性 意味 対応
HTML 4s HTML 4t その他
color=色 フォントの色を指定する × ○ 　
face=フォント フォントの形状を指定する。複数のフォントを指定したい場合はカンマで区切りながら列挙する × ○ 　
font-weight=太さ フォントの太さを指定する。100から900までの値を指定可能で，500が標準の太さとなる × × Fox
size=サイズ フォントの表示サイズを指定する。サイズは1から7の値で指定し，数字が大きくなるほど大きなフォントとなる。また，何も指定しない場合は「3」のフォントとして表示する。また，「+」や「-」を付加して現在のフォントより指定した段階大きくしたり小さくすることも可能だ × ○ 　

その他の属性

属性 意味 対応
HTML 4s HTML 4t その他
class=クラス名 このタグのクラス名。CSSでスタイルを指定する場合などに利用される × ○ 　
dir=方向 タグ内の文字の表示方向。「ltr」を指定すると文字を左から右に，rtlを指定すると「右から左」に表示する。しかし，多くのWebブラウザでは，文字コードを自動判別し，自動的に表示方向を決定している。そのため，日本語を「rtl」と指定しても実際には左から右に表示される。強制的に並び替えを行いたい場合は<bdo>タグを利用する × ○ 　
id=ID タグのID。ダイナミックHTMLでタグを操作する場合や，Java Scriptでのタグの制御，個別にスタイルを指定する場合などに利用する × ○ 　
lang=言語 タグ内に記述した言語。例えば，日本語の場合は「ja」，英語の場合は「en」を指定する × ○ 　
point-size=サイズ フォントの表示サイズを指定する。単位はポイント（pt） × × Fox
style=スタイル タグのスタイル。スタイルの指定方法については「CSSの基本 (2) CSSの記述位置」を参照 × ○ 　
title=タイトル タグのタイトル。一般的にタグの補足情報を記述する。一般的なWebブラウザでは，タグ上にマウス・ポインタを乗せるとツール・チップにtitle属性に指定した内容を表示する × ○ 　

マウスやキーボードの状況変化に関わる属性

属性 意味 対応
HTML 4s HTML 4t その他
onclick=スクリプト このタグに対応する表示結果にマウスの左ボタンをクリックした場合に，指定したスクリプトを実行する × ○  
ondblclick=スクリプト このタグに対応する表示結果にマウスの左ボタンをダブル・クリックした場合に，指定したスクリプトを実行する × ○  
onmousedown=スクリプト このタグに対応する表示結果にマウスのボタンで押下した場合に，指定したスクリプトを実行する × ○  
onmouseup=スクリプト このタグに対応する表示結果にマウスのボタンを離した場合に，指定したスクリプトを実行する × ○  
onmouseover=スクリプト このタグに対応する表示結果にマウス・ポインタが乗った場合に，指定したスクリプトを実行する × ○  
onmousemove=スクリプト このタグに対応する表示結果上でマウス・ポインタが動いた場合に，指定したスクリプトを実行する × ○  
onmouseout=スクリプト このタグに対応する表示結果にマウス・ポインタが外れた場合に，指定したスクリプトを実行する × ○  
onkeypress=スクリプト このタグに対応する表示結果にフォーカスした状態で，キーボードのキーを押下して離した場合に，指定したスクリプトを実行する × ○  
onkeydown=スクリプト このタグに対応する表示結果にフォーカスした状態で，キーボードのキーを押下した場合に，指定したスクリプトを実行する × ○  
onkeyup=スクリプト このタグに対応する表示結果にフォーカスした状態で，キーボードのキーから離した場合に，指定したスクリプトを実行する × ○  

スタイル・シートでフォントを指定する

HTML 4 Strictからはスタイル・シートを利用してフォントの指定を行う。<fontgt;タグで利用可能な属性に対するスタイル・シートは以下のようになっている。

<font>の属性対応するスタイル・シート
sizefont-size
colorcolor
facefont-style

例えば，利用するフォントを「sans-serif」，フォントのサイズを16ポイント，文字色を赤にする場合は，以下のように記述する。

<p>フォントの見栄えを指定する場合は，<span style="font-style:
sans-serif;font-size:16pt;color:#ff0000;">スタイル・シート
</span>を利用する。</p>

関連項目