問題由來：<p>中嵌套<div>標簽，兩個都是塊級元素，按理應該可以正常顯示，但是最后的結果居然是多出來一段<p>的效果，所以就在網上找了許多關於標簽嵌套規則的資料，下面做一個個人總結。
1.塊級元素（block）與內聯元素（inline）的區別：
1.1塊元素，獨占一行，寬高起作用：如：div , p , ul , ol ,table , menu ,h1~h6,li等
1.2內聯元素，可與其他內聯元素同一行，寬高不起作用：如：span , q , input , img ,i等
通過display：block;或者display:inline兩者可以相互轉化。
2.分類明細:(照搬來的）
塊元素(block element) HTML標簽分類明細
* address - 地址
* blockquote - 塊引用
* center - 舉中對齊塊
* dir - 目錄列表
* div - 常用塊級容易，也是css layout的主要標簽
* dl - 定義列表
* fieldset - form控制組
* form - 交互表單 （只能用來容納其它塊元素）
* h1 - 大標題
* h2 - 副標題
* h3 - 3級標題
* h4 - 4級標題
* h5 - 5級標題
* h6 - 6級標題
* hr - 水平分隔線
* isindex - input prompt
* menu - 菜單列表
* noframes - frames可選內容，（對於不支持frame的瀏覽器顯示此區塊內容
* noscript - 可選腳本內容（對於不支持script的瀏覽器顯示此內容）
* ol - 排序表單
* p - 段落
* pre - 格式化文本
* table - 表格
* ul - 非排序列表
內聯元素(inline element) 一般都是基於語義級(semantic)的基本元素，只能容納文本或者其它內聯元素。
* a - 錨點
* abbr - 縮寫
* acronym - 首字
* b - 粗體(不推薦)
* bdo - bidi override
* big - 大字體
* br - 換行
* cite - 引用
* code - 計算機代碼(在引用源碼的時候需要)
* dfn - 定義字段
* em - 強調
* font - 字體設定(不推薦)
* i - 斜體
* img - 圖片
* input - 輸入框
* kbd - 定義鍵盤文本
* label - 表格標簽
* q - 短引用
* s - 中划線(不推薦)
* samp - 定義范例計算機代碼
* select - 項目選擇
* small - 小字體文本
* span - 常用內聯容器，定義文本內區塊
* strike - 中划線
* strong - 粗體強調
* sub - 下標
* sup - 上標
* textarea - 多行文本輸入框
* tt - 電傳文本
* u - 下划線
* var - 定義變量
可變元素是基於以上兩者隨環境而變化的，它的基本概念就是根據上下文關系確定該元素是塊元素還是內聯元素。一旦確定了它的類別，它就遵循塊元素或者內聯元素的規則限制。
* applet - java applet
* button - 按鈕
* del - 刪除文本
* iframe - inline frame
* ins - 插入的文本
* map - 圖片區塊(map)
* object - object對象
* script - 客戶端腳本
3.塊級元素和內聯元素的嵌套規則：
1，內聯元素，可以嵌套內聯元素，不可以嵌套塊狀元素
2，塊元素，可以嵌套塊元素，或者是內聯元素
3，部分塊元素，不能嵌套塊元素，只能嵌套內聯元素，如:p、h1-h6
4, 塊元素中嵌套的元素，塊元素和塊元素一級，內聯元素和內聯元素一級
- 內聯標簽可以嵌套內聯元素，不可以嵌套塊狀元素
<a><a></a></a> 正確 （內聯嵌套內聯）
<a><span></span></a> 正確 （內聯嵌套內聯）
<span><div></div></span> 錯誤 （內聯嵌套塊級）
- 塊元素可以嵌套塊元素（不是所有塊級都可以嵌套塊級），或者是內聯元素
<div><div></div></div> 正確 （塊級嵌套塊級）
<div><span></span></div> 正確 （塊級嵌套內聯）
- 有幾個特殊的塊級元素只能包含內嵌元素，不能再包含塊級元素，這幾個特殊的標簽是：h1~h6、p、dt。所以說p里面不能嵌套div，就是我犯的錯誤。
<p><ol><li></li></ol></p> 錯誤 （特殊塊級標簽只能嵌套內聯標簽）
<p><div></div></p> 錯誤 （特殊塊級標簽只能嵌套內聯標簽）
- 塊元素中嵌套的元素，塊元素和塊元素並列一級，內聯元素和內聯元素並列一級
<div><h2></h2><p></p></div> 正確（塊級和塊級並列一級）
<div><a href="#"></a><span></span></div> 正確（內聯與內聯並列一級）
<div><h2></h2><span></span></div> 錯誤（塊級和內聯並列一級了）