外边距合并问题
兄弟组件中，如果一个设置margin-bottom，另一个设置margin-top，会导致外边距出现合并的问题，例如box1设置下边距50px，box2设置上边距20px，那么二者之间的外边距进行合并取最大值，所以二者之间相距只有50px。
解决办法：
给两个兄弟组件加一个父组件，让父组件开启flex布局
.father{
display:flex;
flex-direction:column;
}
外边距塌陷问题
父子组件中，子组件设置margin-top会导致父组件掉下来
解决办法：
第一种方法：父组件开启flex布局
第二种方法：父组件设置 overflow:hidden
设置overflow:hidden即设置文本溢出隐藏，创建一个BFC，格式化上下文。
面试题：什么是BFC?
BFC又叫格式化上下文，创建一个独立的区域，不受父级的影响也不受子级的影响。