スタイルシートが導入された HTML 4.0,HTML 4.01 では,視覚的要素の記述はすべてスタイルシートで行うことが基本になっている。これらは以前の HTML(HTML 3.2)とどのように対応しているのかまとめてみよう。
文字の色・大きさをインラインで変える <FONT>...</FONT> は,CSS を用いる HTML では使う必要がなくなっている。
これは,<SPAN> によって次のように記述されることになる。
<FONT COLOR="...">...</FONT>
→ <SPAN STYLE="color: ...;">...</SPAN>
<FONT SIZE="...">...</FONT>
→ <SPAN STYLE="font-size: ...;">...</SPAN>
指定のしかたは当然のことながら異なる部分があるので,color,font-size それぞれの値の与え方を参照されたい。
また,色などを指定する範囲が文書中の役割と対応している場合には,その要素の開始タグに STYLE 属性を使って書き込んでもよい。
HTML4 Transitional FACE 属性はほぼ font-family 属性に対応している。
これまで <BODY> に指定してきた多くの属性も CSS にとってかわられる。
<BODY TEXT="...">
→ <BODY STYLE="color: ...;">
<BODY BGCOLOR="...">
→ <BODY STYLE="background-color: ...;">
<BODY> に直接指定するほか,<STYLE> に書き込むか,外部のファイルから取り込むという方法もあるだろう。
センタリングの指定で重宝してきた <CENTER> も,CSS によって不要になる。
<CENTER>...</CENTER>
→ <DIV STYLE="text-align: center;">...</DIV>
<CENTER> はブロック要素であるから,この代わりをするものは <DIV> に限らない。だが,もっとも近い構造としては <DIV> となる。
同様に,右寄せなどの <DIV ALIGN="..."> も ALIGN 属性を使わず,STYLE 属性などで指定する。
<DIV ALIGN="...">...</DIV>
→ <DIV STYLE="text-align: ...;">...</DIV>
<CENTER> の場合と同様に,text-align 属性は <DIV> 以外のブロック要素に指定できる。
<P ALIGN="..."> も同様のことがいえる。
<BASEFONT> は特殊な構造を持ち,インラインで“ここに”と設定したものが新たに指定されるまで有効になる。そのような構造は CSS では存在しないので,同様のことを実現するには異なった方法をとらなくてはならない。
CSS においては“ここから〜ここまで”の範囲でスタイルを指定するので,“<BASEFONT> が新たに指定される場所”がスタイルの“ここまで”であり,次のスタイルの“ここから”になる。<BASEFONT> の効果は要素の入れ子構造にもよるので,暗黙に宣言される“ここまで”があると考えなくてはならない場合もある。
したがって,<BASEFONT> の代わりを正確にさせるためには,それが効いている範囲をよくとらえることが大切である。たとえば複数のブロック要素にまたがってフォントサイズを指定する場合は,次のようになる。
<DIV STYLE="font-size: ...;">
(<P> などのブロック要素)
</DIV>
ひとつのブロック要素についてであったら,その開始タグに,文書全体での既定値のフォントサイズを変えるのであったら <BODY> に指定すればよい。
HTML4 Transitional COLOR 属性,FACE 属性の対応については,<FONT> の場合のように CSS の color および font-family 属性で上記のような指定をすることになるだろう。