有时候决定自己会很多东西，没想到被一个很简单的问题搞的不知所措：
子元素的margin似乎作用到了父元素上面去。为什么？
这是一个bug--父元素的上方与子元素的上方完全重合在了一起，无法分开
摘自深入理解css中的margin属性 - wjbooks - 博客园https://www.cnblogs.com/whwywzhj/p/6127519.html
解决办法：
我没搞懂原理，单单几下解决办法：
方法一：给父元素添加padding-top值
方法二：给父元素添加border值
方法三：给父元素添加属性overflow:hidden;
方法四：给父元素或者子元素声明浮动float
方法五：使父元素或子元素声明为绝对定位：position:absolute;
方法六：给父元素添加属性 overflow:auto; positon:relative；（注：此方法为后续添加，感谢博友@小精灵Pawn提供此方法）
摘自深入理解css中的margin属性 - wjbooks - 博客园https://www.cnblogs.com/whwywzhj/p/6127519.html
原因：
经过了和同学讨论，找到了这个bug的原因：
