文字の大きさを変えてみよう

文字の大きさを変えるタグは沢山あります。最小限知っておけば便利なタグの説明をしておきます。

【注意】
「HTML」の規格を策定している World Wide Web Consortium（W3C）によると、「HTML5」ではこのページで説明しているfont要素は廃止予定です。


要素   
説明                           
font    
フォント装飾（色・サイズ・種類）

見出しをつけるタグ　<h数字>～</h数字>

前回の例では<h1>～</h1>と言うタグが出てきました。

このタグは「見出しを記入する」するのに用います。また、最上位の H1 から最低位の H6 までの、6レベルの見出しが指定できます。

ブラウザは通常、より上位の見出しを大きいフォントで、より低位の見出しを小さいフォントでレンダリングしています。

現在、見出しを検索対象としているサーチエンジンも多く、単に文字のサイズ変更目的の場合は使うべきではありません。

【注意】
近い将来、章節番号の制御を行えるようになる可能性があるようです。例えば、「4.1節を参照」などができるようになり、論文作成などが便利になります。 

文字の大きさを変えるタグ　<font size="数字">～</font>

単に文字の大きさを変化させる場合は<font size="数字">～</font>と言う形のタグを用います。

このタグは、font要素内の文字のサイズを変更してくれます。

文字サイズは「1～7」で指定します。見出しで利用したタグ<h1>～</h1>とは逆に「1」が最少となっています。

注意が必要なのは、以下のように記述し、「終了タグ」は</font size="数字">とは書きません。

<font size="数字">文字</font>

ここで、<font>というのは「要素」ですが、「size」は「属性」と呼ばれます。各要素はこのように「属性」を持っています。他の属性に関しては、文字の色を変える方法で詳しく行います。

【注意】
「HTML」の規格を策定している World Wide Web Consortium（W3C）によると、font要素は廃止される要素となっています。

ただしブラウザは互換性を持たせるため、font要素をサポートしており利用可能です。
興味がある方や、学術目的の方は「スタイルシートを覚えよう」も合わせて参照ください。

文字の大きさを変えるタグ　<big>～<big>と<small>～</small>

その他の文字の大きさを変化させるタグとして<big>～</big>と<small>～</small>があります。これらのタグは、次のような役割を持っています。

<big>～</big>	「大きい」文字（フォント）でレンダリング
<small>～</small>	「小さい」文字（フォント）でレンダリング

使い方は、big・small要素の間に大きさを変えたい文章・文字を記入します。

この例では、終了タグ</big>が来るまで「A」が一つ前の「A」の大きさより順々に大きくなっています。逆に終了タグ</big>が来ると、文字が一つ前の大きさに戻っています。

このように、「終了タグ」が存在するまで、要素内だと判断され「開始タグ」の役割は続いています。

【注意】
「HTML」の規格を策定している World Wide Web Consortium（W3C）によると、「このタグは推奨しないわけではないが、スタイルシートを使うことの方を推奨する」となっています。

こちらも、興味がある方や、学術目的の方は「スタイルシートを覚えよう」も合わせて参照ください。

オススメ書籍

HTML5、CSS3、JavaScript等の学習に役立つ書籍を紹介します。

ページのトップへ戻る