盒模型是css布局的基石，它規定了網頁元素如何顯示以及元素間相互關係。css定義所有的元素都可以擁有像盒子一樣的外形和平面空間。即都包含內容區、補白（填充）、邊框、邊界(外邊距)這就是盒模型。
即：由content +padding +border+margin組成基本的框架
1.padding是在盒子裡面，在盒子與內容之間
2. padding存在於content（內容）與border（邊框）之間的
3. 控制子元素在父元素裡面的位置關係。
4. 會把盒子撐大
5. 如果想讓盒子保持原有的大小：在寬高基礎上減掉。（ 如果乙個元素是被內容撐開的，沒有設定固定的寬高，padding直接撐開。不用減掉 ）
6. padding的設定特點：
padding:30px; 四周
padding:10px 30px; 上下 左右
padding:10px 30px 50px 上 左右 下
padding:10px 30px 50px 100px 上右下左
7. padding不會對背景圖的位置造成影響。
margin在元素外圍，不會撐大元素的大小
控制元素與元素之間的間距。
margin設定方法：
margin:30px; 四周
margin:10px 30px; 上下 左右
margin:10px 30px 50px 上 左右 下
margin:10px 30px 50px 100px 上右下左
1：如果父元素和第乙個子元素沒有浮動的情況下，給第乙個子元素新增margin-top,會錯誤放在父元素上面。
2：兩個相鄰元素上下的margin值 不會疊加 按照較大值設定。
盒模型基礎
盒模型屬性 盒模型有五個屬性分別為 1 width 內容寬度 2 height 內容高度 3 border 邊框 4 padding 內邊距 即邊框到內容之間的距離 5 margin 外邊距 即乙個盒子到另乙個盒子之間的距離 一 width與height 指盒子的寬和高 盒子的體積或者容積，顯示內容...
盒模型基礎內容
盒模型包含有效內容區域，邊框以及外邊距部分 盒模型的寬度 width padding left padding right border right border left marign left marign right 盒模型高度 height padding top padidng botto...
盒模型基礎練習
lang en charset utf 8 name viewport content width device width,initial scale 1.0 web前端基礎知識title rel stylesheet href css page2.css head css盒子模型 h1 網頁設計...