[備忘録][html]dlタグ直下にdivタグはアリなのか？タグの入れ子問題
公開日：2019/11/01
結論を言ってしまうと、アリです。
<dl>
<div>
<dt>定義1</dt>
<dd>説明1</dd>
</div>
<div>
<dt>定義2</dt>
<dd>説明2</dd>
</div>
</dl>
個人的にはなんとなく気持ち悪いんですが、dlタグ直下にdivタグを入れてその中にdt・ddを入れる構造はアリなんです。
気持ち悪いとか言っちゃいましたが、アリって言われると助かる場面もあるので、実はありがたかったりもします。
例えば、flexboxを使いたいときなどは便利です。
- 一部のHTMLバリデーターではエラー扱いになっていたりもしますが、気にしないでください。
ulタグ直下にdivタグはアリなのか？
結論を言ってしまうと、ナシです。
<ul>
<div>
<li>ダメな例やで</li>
</div>
</ul>
たまに実際に運営されているwebページでこういうコードをみかけますが、ulタグ直下にdivタグという構造はありえません。
ulタグ直下に入れられるのはliタグのみです。
当然とは思いますが、念の為olタグも直下に入れられるのはliタグのみです。
タグの意味や入れ子ルールをおさらい
html4やxhtmlが主流だったあたりからhtmlコーディングをやっていたりすると、ブロック要素とかインライン要素とかを意識して仕事をしていたと思います。
しかし、いま主流のhtml5はブロック要素・インライン要素という考え方をしません。
そういうわけで、タグの入れ子についても微妙に違ってきているようです。
あの頃から変わっていないこともありますが、タグの意味を含め、ときどきおさらいすると良いかもですね。
- 更新記録
-
- 2019/11/03 olについて追記
- 2019/11/08 バリデーターについて追記