CSS學習04-盒子模型

一、什麼是盒子模型
盒子模型 (Box Model) 規定了元素框處理元素內容、內邊距、邊框和外邊距的方式。
二、標準盒子模型和IE盒子模型

元素框的最內部分是實際的內容，直接包圍內容的是內邊距。內邊距呈現了元素的背景。內邊距的邊緣是邊框。邊框以外是外邊距，外邊距默認是透明的，因此不會遮擋其後的任何元素。內邊距、邊框和外邊距都是可選的，默認值是零。
在 CSS 中，width 和 height 指的是內容區域的寬度和高度。增加內邊距、邊框和外邊距不會影響內容區域的尺寸，但是會增加元素框的尺寸。
內外邊距的設置方式：
外邊距:
margin：a px b px c px d px；上 右 下 左
margin：a px； 上下左右四個方向外邊距都是a px
margin：a px b px； 上下外邊距是a，左右外邊距是b
margin： 0px auto；上下外邊距是0，左右外邊距是自動
margin-left：a px；左邊距是a
margin-right：b px；右邊距是b
margin-top：c px；上邊距是c
margin-bottom：d px； 下邊距是d
內邊距設置方式同外邊距相同。