nextup previousindex
Next:4.7 物理的表現と論理的表現 Up:4. HTMLの骨格 Previous:4.5 段落、改行、横線

4.6 見出しと文字の大きさ

 

見出し(ヘディング)は、hタグ環境を使います。

h  [Strict] [Transitional]
<hlevelattributes ...>〜</hlevel>でそのタグ環境内の見出しレベルを指定します。
level の部分にレベルの数値を記述します。

グラフィカルなブラウザのほとんどでは、

レベルの数が小さいほど、大きなフォントで表示します。

<h>タグとは、見出しを設定するためのタグで、<h1>〜<h6>まで6段階のレベルの見出しを定義します。

<h1>が最も上位のレベルでフォントサイズも大きくなり、<h6>が最も下位レベルとなりフォントサイズも小さくなります。

また見出しの前後には空行が入り、フォントは太字で表示されます。

このタグは見出しを定義するためのタグであり、SEO対策の観点からもセクションごとの見出しを適切に記述することが重要です。

<h* align = "***">とは、<h>タグにalign属性を指定したもので、見出しの位置を指定する場合に用いられます。

値には"left"(左揃え)、"center"(中央揃え)、"right"(右揃え)などを指定します。

  1. 最も大きい(重要な)レベルです。
  2. 項目見出しなどに使うレベルです。
  3. 通常のレベルです。
  4. やや小さいレベルです。
  5. 注釈などに使うレベルです。
  6. 最小レベルです。

attributesには次のようなものを取ります。

align
 [Transitional][省略可]位置を指定します。

align="Justification"で、次のような値を取ります。

  • left:左寄せします。
  • center:中寄せします。
  • right:右寄せします。
  • justify:左右のマージンを元に調整します。
以下の詳細は99
class
dir
id
lang
onclick
ondblclick
onkeydown
onkeypress
onkeyup
onmousedown
onmousemove
onmouseout
onmouseover
onmouseup
style
title

h1:最も大きいレベル。

h2:大き目のレベル。

h3: 通常レベル。

h4:やや小さいレベル。

h5:小さいレベル。
h6:最小レベル。

上付きテキスト、下付きテキストもsupタグとsub タグを使って扱うことができます。

sup  [Strict] [Transitional]
<sup attributes ...>〜</sup>でタグ環境のテキストを上付きテキストにします。

attributesには次のようなものがあります。

supsup

以下の詳細は99
class
dir
id
lang
onclick
ondblclick
onkeydown
onkeypress
onkeyup
onmousedown
onmousemove
onmouseout
onmouseover
onmouseup
style
sub
<sub attributes...>〜</sub>でタグ環境のテキストを下付きテキストにします。

attriburessupタグと同じです。

subsub

basefontfontタグ、big タグ、それにsmallタグを使うと、フォントの大きさをテキスト中で変更することができます。

なお、hタグは見出しを意味する論理的表現なので、フォントの大きさを変えるために使ってはいけません。

また、これらのタグは推奨されていません。

basefont [Transitional]
<basefont attributes ...>はページ内で基本となるフォントサイズを設定します。

EMPTYタグです。

attributesには次のようなものが入ります。

color
 [Transitional][省略可]color="#rrggbb"またはcolor="Color"で指定し、ベースの文字の色を変更することができます。

色の指定については、7 を参照してください。

face
 [Transitional][省略可]face="font[,font] [,font]"は、システムのフォントを直接指定します。

値は3つまで取ることができ、1つめのフォントがなければ次のフォントが、それもなければ次のフォントが、と探していきます。

例えば、Helvetica,Arial,Panatinoの順に探していかせるのであれば、face="HELVETICA,ARIAL,PANATINO"と指定します。

id
 [Transitional][省略可]id="name"は、このタグに固有のIDを振ります。
size
 [Transitional][必須]size="number">は、基本となるフォントサイズを設定します。

デフォルトは3になっています。

1が最小、7が最大です(hタグと逆になります)。

big  [Transitional]非推奨
<big attributes ...>〜</big>は現在のフォントより1つ大きいサイズのフォントで表示します。

attributesには次のようなものが入ります。

bigbig

以下の詳細は99
class
dir
id
lang
onclick
ondblclick
onkeydown
onkeypress
onkeyup
onmousedown
onmousemove
onmouseout
onmouseover
onmouseup
style
font [Transitional]
<font attributes ...>〜は、フォントのサイズや種類、色などを変更します。

attributesには次のようなものを指定できます。

class
 [Transitional][省略可]class="cdata"は、タグ内のテキストへセットする情報をクラスの形で指定します。

詳細は5 を参照してください。

color
 [Transitional][省略可]color="#rrggbb"またはcolor="Color"で指定し、文字の色を変更することができます。

色の指定については、7 を参照してください。

dir
詳細は4.3 を参照してください。
face
 [Transitional][省略可]face="font[,font][,font]"は、システムのフォントを直接指定します。

値は3つまで取ることができ、1つめのフォントがなければ次のフォントが、それもなければ次のフォントが、と探していきます。

例えば、Helvetica,Arial,Panatinoの順に探していかせるのであれば、face="HELVETICA, ARIAL, PANATINO"と指定します。

id
 [Transitional][省略可]id="name"は、このタグに固有のIDを振ります。
lang
詳細は4.3 を参照してください。
size
 [Transitional][省略可]size="number"で指定し、numberには数値として1〜7(1が最小、7が最大)を入力します。

また、+number-numberを使い、直前の値から変更することも可能です。

style
詳細は5 を参照してください。
title
 [Transitional][省略可]title="titlename"は補助用タイトルを指定します。

推奨されていない要素

FONT は囲んだテキストの字体、色、サイズを指定する用途で広く使われています。

この機能は既に HTML から CSS へと移されています。

FONT 要素は同じスタイル情報を持つ SPAN 要素に単純に置き換えることが出来ます

<FONT color="blue" face="Helvetica"> マジで <FONT size="+1">デカい</FONT> 靴 </FONT>

であれば次のように…

<P><SPAN style="color:blue; font:Helvetica">マジで<SPAN style="font:larger">デカい</SPAN> 靴 </SPAN><P>

或いはもっと簡単に…

<P style="color:blue; font:Helvetica"> マジで <SPAN style="font:larger">デカい</SPAN> 靴 <P>

これは文書内でのフォント変更の適切な手段です。

しかしながら、スタイルの使用としては最良とは言えません。

というのも CSS の凄いところは個別のスタイルを必要とする全ての要素で繰り返すことなく、文書間に渡って適用できる論理グループにテキストその他のスタイルを集める事が出来るというところにあるのですから。

small [Transitional]
<smallattributes ...>〜</small>は現在のフォントより1つ小さいサイズのフォントで表示します。

attributesには次のようなものが入ります。

 smallsmall

以下の詳細は99
class
dir
id
lang
onclick
ondblclick
onkeydown
onkeypress
onkeyup
onmousedown
onmousemove
onmouseout
onmouseover
onmouseup
style
title

fontタグの使用例を次に示します。

Font size 1,Blue
Font size 2,Red
Font size 3,Purple
Font size 4,Green
Font size 5,Cyan
Font size 6,Yellow
Font size 7,White

Summary:書式


nextup previousindex
Next:4.7 物理的表現と論理的表現 Up:4. HTMLの骨格 Previous:4.5 段落、改行、横線
Kenshi Muto
平成11年9月19日
OKANOs
2005年08月13日

HTMLマニュアル

広告