タイトル画像
サイトタイトル画像

文字の大きさの変更 big, small

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

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

【注意】
「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タグ例

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

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

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

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

オススメ書籍

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

人気コンテンツ

    Copyright ©2015 .(since 1999/09/30)