トップページ>ホームページ実用小技集>スタイルシート基礎講座

9.<SPAN>タグと<DIV>タグ

<SPAN>タグと<DIV>タグはスタイルシートでよく使われます。どちらもそれ自身では表示に何の効果ももたらさないので、スタイルの設定に適しているのです。
 SPANはインライン要素、DIVはボックス要素の指定に使います。
 インラインは「1行のある部分だけ」「1つの段落の特定部分だけ」と考えればいいと思います。

記述例:1行のある部分だけ文字の色を赤で13ポイントに変えます。

 1行のある部分だけ<SPAN STYLE=" color: red; font-size: 13pt;">文字の色を赤で13ポイント</SPAN>に変えます。

これに対してボックスは「1つ以上の段落」と考えていいと思います。段落1つだけの場合はPタグと同じことになります。ただし、DIVタグを使うと、改行はされますが、Pタグのように段落の間が1行空きません。

上の記述例のSPANをDIVに変えると、こんな表示になります。

記述例:1行のある部分だけ

文字の色を赤で13ポイント
に変えます。

1行のある部分だけ<DIV STYLE=" color: red; font-size: 13pt;">文字の色を赤で13ポイント</DIV>に変えます。


[BACK][NEXT]
…to be continued