外边距叠加
外边距叠加其实是一个非常简单的概念，不过，一开始我还是被其高大上的名字（margin-collapsing）唬得不轻~
什么是外边距叠加呢？在normal流中，同一BFC下，相邻垂直外边距会重叠形成一个外边距，外边距高度为叠加的外边距较大者。（我是这样记住的：尽量在满足双方的margin下，使得margin尽量贴近border、padding、内容。如果元素没有border、padding、内容，塌得挺严重的~）
外边距叠加的情况：
1. 2个垂直相邻的元素，第一个元素的底外边距与第二个元素顶外边距重叠
2.当一个元素包含另一个元素，若这两元素之间无border，padding，则它们的垂直外边距会叠加
3.元素的顶与底边距在无内容，padding，border时也会叠加，已叠加的空元素之间也会叠加（例子：多个有margin的p元素没有高度）
so~难道外边距叠加是一个BUG，如果是，为何不在新版本的css中剔除它呢，我认为其实很多bug不是真正意义上的bug。而是我们用的不恰当，没有深入了解css，所谓的bug不过是用错了的方法，那外边距坍塌为何出现呢？1.外边距叠加使得元素之间的距离一致 2.使得空元素不会占据过多不必要的空间 当然，第一个原因意义大些，至少，尽量减少不必要的元素节点是我们的职责~
看出来了了吗？这里插多一句，可以看出body与html元素默认是不重合的，注意：absolute定位的最外层是基于<html>的，而relative与static的最外层定位元素是<body>~
