divタグの意味と使い方
- 2007年02月28日
- category:XHTML/CSS
- Comment(0)
- Trackback(0)
XHTMLのタグにはそれぞれ意味があります。<p>は文章のまとまり（段落）。<blockquote>は引用。<ul><li>はリストなどですね。 では<div>タグというのはどういう意味を持っているのでしょう？
以下MITSUE-LINKSより引用
<div>タグは、ドキュメントを分離して、個々のセクション（ディビジョン）に明確に分けるためのタグです。特定の範囲を設定しドキュメントの構造化に役に立ちます。主にスタイルシートを適用する範囲に用いられたり、センタリング、右寄せなどの範囲指定に使われています。
なるほど。つまりXHTML文章をグルーピングするためのタグであると解釈しました。それなら確かに意味がある。しかしそれなら<div>タグの中に直接テキストを書くような、下記ソースは間違っているわけです。
<div>
今日も僕は元気です。
</div>
段落でもないしリストでもないからと、仕方なくこのようなマークアップをしていたこともありました。しかし、これでは「僕は元気です。」の文章は構造上の意味を持たないのでこのようなケースでは<p>を使うべきだと思います。人それぞれの考え方がありましょうが、僕はそう思います。
それではこのようなソースはどうでしょう。
<div class="rt">
<div class="lt">
<div class="rb">
<div class="lb">
<p>今日も僕は元気です。</p>
</div>
</div>
</div>
</div>
これは丸角を実現するときなどによく用いられる方法ですが、<div>がこんなに入れ子になってると見た目も悪いし、なにより「セクション分けしてグルーピングする」という<div>の構造上の意味がまるっきり無視されています。これはjavascriptなどを使用することで回避できますが、XHTML+CSSのみで的確なマークアップで実現するのは現状ではほぼ不可能だと思います。CSS3の草案には丸角を実現するプロパティが上がっているらしいので将来的には解決される問題でしょう。
つまり何が言いたいかというと、<div>を使うのはいいがその意味をわかって使わないと構造上間違えたXHTMLになってしまうので気をつけようということです。 しかしながら先にも述べたように、現状ではどうしても対応できない問題も多々あります。将来的に改善策が見つかるまでは意味を持たない<div>タグを使用したコーディングも ケースバイケースで必要であると思います。もちろん正しいマークアップになるように最大限努力はしなければならないと思います。
- Prev Entry
- javascriptの参照渡し
- Next Entry
- 画像の下にできる隙間
トラックバックURL
http://webtech-walker.com/archive/2007/02/28161125.html/trackback
※トラックバックを受け付けてから表示するまでにしばらく時間がかかる場合があります。
