css的框模型速查

在css中，每個元素被視為一個框。

每個框具有3個屬性：

border 框的邊框

margin 框與相鄰框之間的距離

padding 框内容和邊框之間的距離

對于margin存在一種特例：當元素底部頁邊空白接觸另一個元素的頂部頁邊空白，隻會顯示其中範圍較大的頁邊空白，如果2個頁邊空白大小相同，則最終的頁邊空白将等于其中一個頁邊空白的大小。

預設情況下，塊級元素将占用頁面（或者包含它的元素）的整個寬度，而内聯元素将僅占用它需要的空間。

img元素貌似塊級元素，實際是内聯元素。

元素實際寬度計算大小為：

act_width = margin-left + border-left + padding-left + width + padding-right + border-right + margin-right

padding屬性值的機關可以是百分比。如果訓示body元素的内邊距是10%，則浏覽器視窗寬度的5%将作為body元素内容内的每一邊的内邊距。如果訓示一個位于100像素正方形單元格td元素具有10%的内邊距，則邊框正方形每一邊周圍将具有5個像素的内邊距。元素的padding屬性不會繼承。

height 設定框的高度

width 設定框的寬度

line-height 設定文本行的高度（類似于行距設定）

max-height 設定框的最大高度

min-height 設定框的最小高度

max-width 設定框的最大寬度

min-height 設定框的最小寬度

overflow 屬性：

hidden 超出框範圍内容被隐藏

scroll 框内增加卷軸框