CSS中的盒子模型是由几个属性组成的
content padding border margin
content 指的是盒子内容的 宽度和高度 (height width)
padding （内边距）指的是内容距离盒子边框 内边缘的距离 它有四个方向
border (边框) 边框包裹着内容和内边距 边框可以有宽度 它有四个方向
margin (外边距) 不同的盒子边框外边缘距离另一个盒子边框外边缘的距离
盒子模型的兼容问题:
1、margin值:如果两个盒子上下排布,上面的盒子给值margin-bottom，下面的盒子给值margin-top，那么盒子和盒子之间的距离不是他们两个的和，而是取其中的最大值；
2、margin值:当盒子之间是父子级关系的时候，如果父级盒子没有边框值，没有padding值，那么就会发生子级盒子的margin-top值传递给其父级盒子
解决办法:给父级盒子 overflow：hidden;这个属性(溢出隐藏),这里面不是进行隐藏，而是将超出盒子的部分收回来
padding: 10px 20px 30px 40px; 上 右 下 左
padding：10px
padding: 10px 20px 20px; 上 左右 下
padding: 10px 20px; 上下 左右
margin: 10px 20px 30px 40px; 上 右 下 左
margin：10px
margin: 10px 20px 20px; 上 左右 下
margin: 10px 20px; 上下 左右
每一个元素都有自带的css属性(内置属性),那么每一个浏览器对这些属性的解析是不同的，为了保证所有浏览器显示相同，我们需要进行全局样式的重新定义,给每个元素的初始值设置相同