當對乙個文件進行布局的時候，瀏覽器的渲染引擎會將所有的元素表示成乙個個的矩形盒子。css盒模型本質上就是乙個盒子，封裝周圍的html元素。它包括四個部分: 邊距（margin）， 邊框（border），填充（padding），內容（content）。
下面的說明了盒子模型（**於網路，侵刪） ：
由於歷史原因，css的盒模型分為兩類——w3c標準盒模型和ie盒模型。 這兩個盒模型最核心的區別就是在ie的盒子模型其content的部分包含了padding和border。而標準盒子模型content部分即為content部分，不包含其他的部分。
標準盒子模型:
ie盒子模型：
當我們在設定元素的width和height屬性的時候，我們設定的是盒模型的content區域的大小。對應到盒模型上就是:
標準盒模型：
width = content的寬度
height = content的高度
ie盒模型：
width = border + padding + content的寬度
height = border + padding + content 的高度
利用css的屬性box-sizing可以設定這兩個盒子模型
box-sizing: content-box;
(標準盒子模型)
box-sizing: border-box;
(ie盒子模型）
css盒子模型 CSS 盒子模型
css 盒子模型基本上是面試的必考題，因為實在是太重要了。以前寫 css 總是感覺元素的寬高十分難調，其中乙個很大的問題就是忽略了盒子模型的重要性。說到 css 盒子模型，你可能會說我知道呀，就是 margin 包 border,border 包 padding,padding 包 content ...
css盒子模型 說說css盒子模型
引用mdn官方的解釋 當對乙個文件進行布局 lay out 的時候，瀏覽器的渲染引擎會根據標準之一的 css 基礎框盒模型 css basic box model 將所有元素表示為乙個個矩形的盒子 box css 決定這些盒子的大小 位置以及屬性 例如顏色 背景 邊框尺寸 每個盒子由四個部分 或稱區...
css盒子模型實驗報告總結 CSS盒子模型知識總結
本章內容 知識點一 盒子模型 box model，由有內容 element content 填充 padding 邊框 border 邊界 margin 這四個組成部分，這四個部分都包含有top right bottom left四個組成部分。說明 圖中元素框的最內部分是實際的內容 element ...