盒子模型
作用：盒子模型是用来描述一个元素的宽高，边框，内容，距离，边框的大小以及元素与元素的距离
从内到外盒子模型有这几个属性组成
- width 内容宽度 height 内容高度
- padding-top、padding-right、padding-bottom、padding-left
==padding是内边距，内容距离盒子内边缘的距离== - border 边框 边框只有厚度（高度），没有宽高，border也分别为四个方向
- margin-top、margin-right、margin-bottom、margin-left
==margin是位边距 元素元素之间的距离==
image
widht/height 内容的宽度和高度，和整个盒子的宽高四两个概念
-
padding 内容边缘距离盒子边框内边缘的距离，有四个方向，有不同的写法
- padding-top、padding-right、padding-bottom、padding-left
- padding: 10px 20px 30px 40px; 上 右 下 左
- padding: 10px 20px 30px; 上 左右 下
- padding: 10px; 四个方向都是10px;
border 边框 由宽度 样式 颜色，默认一个盒子的边框宽度为3px，样式为无，颜色为黑色
这三个属性如果没有设置样式，边框也不会出现
