HTML P不能包含块级元素（包括自身）

abcc项目中碰到的，在一个表单中用P包含一个label和div，从Firebug中看html结构div却跑到P外面去了。甚是诧异，原来P元素是不能包含块级元素（包括P自身）的。

The P element represents a paragraph. It cannot contain block-level elements (including P itself). 

以下是html片段，P包含了一个行内及块级元素，没有一个浏览器是按代码的结构去渲染的。

<p>		

	<label for="username">用戶名：</label>

	<div>

	<select name="username">

		<option value="1">張三</option>

		<option value="2">李四</option>

		<option value="3">王五</option>

	</select>

	</div>

</p>

FF下渲染DOM结构如下：

IE6/7/8

IE9

Chrome/Safari

Opera

以上图可以看到

IE6/7/8 是一种结构，IE9/Opera是一种结构，Firefox是一种结构，Safari/Chrome又是一种结构。

HTML貌似简单，但胡乱嵌套到导致很多意想不到的bug。如样式丢失，样式变形等等。须注意。

相关：HTML元素嵌套表