1、盒子模型作用：
盒子模型就是乙個盒子，封裝周圍的html元素。允許我們在其他元素和周圍元素邊框的空間放置元素。
2、組成：
外邊距（margin）：相鄰的兩個盒子margin，會發生摺疊，可為負數
邊框（border）：
內邊距（padding）：
實際內容（content）：百分比相對于父容器的content box 的寬度，只有包含塊的高度不依賴該元素時，百分比寬度才生效
*ie盒模型和w3c盒模型在計算總寬度中存在一些差異
w3c盒模型：width=content.width；heigth=content.heigth
ie盒模型：width =content.width+border +margin；height=content.height+margin+border
content-box: 瀏覽器定義元素的螢幕寬度和高度的預設方法, 會將border寬度和padding厚度與width和height屬性值相加,來確定該標籤的螢幕高度和寬度
padding-box-: 當你在乙個樣式中設定了width和hight屬性時,它應該包含padding作為該值的一部分
border-box: 包含了border寬度和padding厚度,將它們作為width和height的一部分.
CSS 理解盒子模型
什麼是盒子模型？對於初學者來說，很難說出來，但是對於生活中的盒子大家熟悉吧，哈哈，這裡提到的盒子模型你就可以理解成現實生活中的盒子就可以了，不然怎麼能起個名字叫 盒子模型 呢 好！既然和現實生活中的盒子一樣，那我們想一下，生活中的盒子內部是不是空的好用來存放東西，而裡面存放東西的區域我們給他起個名字...
css 盒子模型理解
盒子模型是html css中最核心的基礎知識，理解了這個重要的概念才能更好的排版，進行頁面布局。下面是自己積累和總結的關於css盒子模型的知識 希望對初學者有用。一 css盒子模型概念 css css盒子模型 又稱框模型 box model 包含了元素內容 content 內邊距 padding 邊...
css 理解 盒子模型
什麼是css的盒子模式呢？為什麼叫它是盒子？先說說我們在網頁設計中常聽的屬性名 內容 content 填充 padding 邊框 border 邊界 margin css盒子模式都具備這些屬性。這些屬性我們可以把它轉移到我們日常生活中的盒子 箱子 上來理解，日常生活中所見的盒子也具有這些屬性，所以叫...