盒模型是css构造的基石，它规定了网页元素如何显示以及元素间彼此关系。

css界说所有的元素都可以拥有像盒子一样的外形和平面空间。

即都包罗内容区、补白（填充）、边框、界限(外边距)这就是盒模型。

换句话说，盒模型就如同一个屋子，除了内部的货物以外，内部的其他空间就相当于接下来要介绍的padding属性；

屋子的墙壁就相对付border属性；

衡宇院子就相当于margin属性；

衡宇占地面积=内部货物+内部其他空间+墙壁宽度+院子面积。

综上所述，盒模型的总巨细=内部元素+padding空间+border空间+margin空间

Padding详解

1、padding是在盒子里面，在盒子与内容之间；

2、padding的感化：控制子元素在父元素里面的位置关系。

3、padding会把盒子撑大，如果父元素设置了高度或宽度，

　　需要减去对应的padding值才华保证父元素本来的巨细，

　　如果父元素没有设置高度或宽度就不用管

4、如果给单一标的目的添加padding，网页破解qq空间访问权限 ，padding-top/left/right/bottom

5、padding值的的个数

　　1个值暗示四周

　　2个值暗示摆布、上下

　　3个值暗示上、摆布、下

　　4个值不是上、右、下、左

margin详解

1、margin在元素外围，不会转变元素巨细，但会增大元素所占空间

2、感化：控制元素与元素之间的距离

3、如果给单一标的目的添加margin，margin-top/left/right/bottom

4、margin值的的个数

　　1个值暗示四周

　　2个值暗示摆布、上下

　　3个值暗示上、摆布、下

　　4个值不是上、右、下、左

如果觉得对本身有辅佐，麻烦点一下存眷，会一直和大家分享常识的，感谢！！！