深刻理解CSS盒子模型

1 盒模型主要用於塊級元素在網頁上的佈局和定位問題，而行內佈局模型則適用於行內元素。

2 在css中用width和height屬性肯定一個元素的寬度和高度時，這個width和height只是內容區域的寬和高，並不包括內邊距、邊框和外邊距(但在IE的早期版本包括IE6中，盒模型的width和height卻偏偏是這樣定義的，儘管符合人們思考的邏輯，可是不符合規範，會形成嚴重的問題)。

3 若不對一個元素的width和height屬性做任何設定，其默認值就是auto。但對於採用不一樣方式進行定位的元素，瀏覽器對其width有兩種處理方式（雖然都是默認值auto）：

    1 對於position:static 或 position:relative 的元素而言，其寬度是該元素包含塊的寬度減去其左右外邊距、左右邊框和左右內邊距。也就是說：該元素盡最大可能撐滿包含塊。

    2 對於position:absolute 或 position:fixed 或 浮動定位元素而言，其寬度是就是其實際內容的寬度。

4 不管內容區域如何定位，若是高度，最小高度(min-height)，最大高度(max-height等沒有被聲明的話，內容區域高度與內容的高度是相等的。