css盒子模型详解

盒子：把所有的网页元素都看成一个盒子，它具有： content，padding，border，margin 四个属性，这就是盒子模型。

W3C模型中：

CSS中的宽（width）=内容（content）的宽

CSS中的高（height）=内容（content）的高；

content（内容）:包含内容的宽高大小；（width/height决定）

padding（内边距/填充）：透明部分，在盒子周围（left/top/right/bottom决定）

border（边框大小）：内边框和内容之间（left/top/right/bottom决定）

margin（外边距）：边框外区域，透明部分（left/top/right/bottom决定）

值为auto时，为方向距离自适应，即默认值。