盒模型的學習，乙個盒子中的主要屬性有5個：width，height，padding，border，margin；這五個屬性在css中代表的主要含義，weight在css中表示的是內容的寬度，而不是盒子的寬度；height指的是內容的高度，而不是盒子的高度；padding是內邊距的意思；border指的是邊框，margin指的是外邊框。
在css中，寬度和真實占有的寬度不是乙個概念，真實寬度=左border+左padding+width+右padding+右border；在css中，如果想要保持乙個盒子的真實占有寬度不變，那麼增加width就要相應的減去padding，增加padding就要相應的減去width；padding是內邊距，有背景顏色，padding是4個方向的；分別為：padding-top,padding-right,padding-bottom,padding-left;在編寫padding屬性的時候，有兩種方法，第一種是寫小屬性，例如：padding-left:20px;
padding-right:30px;
padding-top:20px;
padding-bottom:10px;
第二種是寫綜合屬性，綜合屬性用空格隔開，例如：padding:30px 20px 40px 100px；四個數字按順序分別為：上、右、下、左；在寫綜合屬性的時候，可以寫四個屬性值：padding:30px 20px 40px 100px；盒模型為：
三個屬性值：padding:30px 20px 40px ，沒有左邊屬性值，此時該值與右邊屬性值相同；盒模型為：
兩個屬性值：padding:30px 20px，此時下邊的屬性值與上邊的屬性值相同，左邊的屬性值與右邊的屬性值相同；盒模型為：
乙個屬性值；padding:200px ；盒模型為
在編寫盒模型時，要懂得用小屬性層疊大屬性，例如：padding:20px;
padding-left:30px
盒模型為：
上面為盒模型的基礎知識，目前自己在自學習前端知識，是自己總結的，望大家多多指教！
前端盒模型
所有html元素可以看作盒子，在css中，box model 這一術語是用來設計和布局時使用。css盒模型本質上是乙個盒子，封裝周圍的html元素，它包括 外邊距 margin 邊框 border 內邊距 padding 實際內容 content 四個屬性。盒模型允許我們在其它元素和周圍元素邊框之間...
前端系列教程之CSS（盒模型）
margin 外邊距 清除邊框區域。margin沒有背景顏色，它是完全透明 border 邊框 邊框周圍的填充和內容。邊框是受到盒子的背景顏色影響 padding 內邊距 清除內容周圍的區域。會受到框中填充的背景顏色影響 content 內容 盒子的內容，顯示文字和影象 最終元素的總寬度計算公式是這...
前端面試之盒模型
當你對乙個文件進行布局 laying out 時候,瀏覽器引擎會根據css box模型將所有元素描述為乙個盒子,css會決定這些盒子的大小,位置,屬性 顏色,邊框.盒模型分為兩類 ie盒模型和標準盒模型。兩者的區別在於 ie盒模型的width height content border paddin...