2021-09-19框模型

框模型：（凡是元素皆为框）

框模型：又称盒子模型，它定义了元素框处理元素内容，内边距，外边距，以及边框的计算方式
默认计算方式：

实际占地宽度 = 左右外边距+左右边框+左右内边距+width；
实际占地高度 = 上下外边距+上下边距+上下内边距+height；
margin+border+padding+(content=width=height)=盒子模型；

外边距：

外边距：在边框外的空白间距，一般用于指元素与元素之间的间距
属性：margin
取值：1：以px或%为单位的数字
      2：auto 自动，控制块元素在水平方向居中对齐
      3：负数  元素向着相反的方向移动
单边取值：maigin-top；上外边距
      margin-bottom；下外边距
      margin-left： 左外边距
      margin-right：右外边距
      
 不同数值的设置：margin-value；表示四个方向的外边距
               margin：v1  v2；  上下   左右
               margin：v1  v2  v3    上     左右    下
               margin：v1  v2  v3  v4  上  右  下  左

内标记：

内标记：边框与内容区域之间的空白间距
特点：增加内边距会扩大边框的包含范围
属性：padding
取值：以px或%为单位的数字
单边设置：padding-top；
         padding-buttom；
         padding-left；
         padding-right；
设置不同数值：padding-value；表示四个方向的内边距
            padding：v1  v2；  上下  左右
            padding：v1  v2  v3；上   左右  下
            padding：v1  v2  v3  v4； 上  右   下  左