最近复习了CSS相关的知识点，整理总结了经典的CSSmarginOverlap问题，目的是测试复习效果，希望对其他人有所帮助，疏漏本人也愿请各位前端大牛赐教。问题：在使用CSS排版布局时，会发现兄弟节点或父子节点设置的上下边距会重叠，如下图112233当我们看整个高度部分，它实际上应该是345px。由于父子兄弟的外边距重叠，我们会发现高度是320px。那么在实际应用中如何解决这个问题呢？创建BFC（完整的块级格式化上下文）可以解决这个问题。首先，明确BFC的原理。BFC中的元素与外部元素互不影响。是一个相对独立的封闭区域；相邻的BFC之间不会有交互。垂直外边距发生重叠，也就是说，如果你想让元素的外边距不重叠，你必须创建一个BFC区域；BFC区域不会与浮动元素的框重叠；BFC计算高度的时候，浮动元素也会算在Inside里；如何创建BFC？1.设置溢出属性不可见；2.浮动不是没有；3.position的值不是静态的，也不是相对的；4.显示属性为表格时；<样式>.out{宽度：100%；背景颜色：粉红色；溢出：隐藏；}.out>div{高度：100px；宽度：100%；背景色：rgb(223,136,23)；边距：5px010px；/*溢出：隐藏；*/向左飘浮;}112233当我们再次查看section时检查高度，你会发现高度已经恢复为345px，同时也证明了BFC在计算高度的时候，也会统计浮动子元素的高度；
