1。首先，了解一些词汇——流入元素？如果一个元素是浮动的、绝对定位的或者是根元素，那么它就是一个流外元素。也就是我们常说的元素脱离文档流。如果一个元素不在流外，即仍在文档流中的元素，则称为流入元素。-流入块级盒子？流入块级框是由流入块级元素生成的框。-什么是格式化上下文？常规流程中的框属于格式化上下文，它可能是块或内联的，但不能同时是（块和内联）。块级框参与块格式化上下文。行内级框参与行内格式化上下文。在块格式上下文中，框从包含块的顶部开始垂直放置一个接一个。两个兄弟框之间的垂直距离由margin属性决定。合并同一块格式化上下文中相邻块级框之间的垂直边距。创建新的块级格式化上下文（BFC）的条件：float元素，float是除none以外的值。绝对定位的元素，position(absolute,fixed)display为以下值之一inline-blocks,table-cells,table-captionsoverflowvisible以外的(hidden,auto,scroll)注意：“display:table”本身不不生成BFC，而是生成一个匿名帧，匿名帧中包含“display:table-cell”的帧会生成BFC。-行框在内联格式化上下文中，框一个接一个地水平放置，从包含块的顶部开始。这些框之间的水平边距、边框和填充是有效的。框可以以不同的方式垂直对齐：通过它们的底部或顶部，或者通过它们内部文本的基线。包含来自同一行的框的矩形区域称为行框-相邻边距？两个边距相邻当且仅当：都属于流入块级框，并且在相同的块格式化上下文中。没有线框，没有间隙，没有填充，也没有分隔它们的边界（注意，因此一些0高度线框）都是垂直相邻的框边缘，即来自以下某对：*框的顶部边距和它的第一个流入子元素的上边距*一个框的底部边距和它的下一个流入后兄弟的上边距*最后一个流入子元素的底部边距及其父元素的底部边距，如果父元素的高度是computedas'auto'*不建立新块格式化上下文的框的上下外边距并且min-height的计算值为0，height的计算值为0或'auto'，没有流入的孩子。如果边距的任何部分与另一个边距相邻，则认为它与该边距相邻。是合并（折叠）的边距。2.什么是marginmerging（overlapping）在CSS中，两个或多个盒子（可能但不一定是兄弟）相邻的margin会合并为一个margin。以这种方式组合Margin称为collapse，由此产生的合并margin称为mergedmargin。3.合并规则相邻垂直边距将被合并，除了：根元素框的边距不合并。如果一个有间隙的元素的上下边距相邻，它的边距将与紧跟其后的相邻兄弟的边距合并，但生成的边距不会与父块的底部边距合并。不会合并水平边距。合并的计算规则当合并两个或多个边距时，生成的边距的宽度为合并后的边距宽度中的最大值。对于负margin，正相邻margin的最大值减去负相邻margin的绝对值的最大值。如果没有正边距，则用0减去相邻边距绝对值的最大值4.总结所以综上所述，只要两个边距分开，就不会出现边距重叠的情况。可以上下border分隔，上下padding分隔，也可以height分隔，流中的sub-level分隔，gaps分隔（gaps的产生与clear有关），可以newcreate通过formating分隔语境。以下是CSS2.1规范的摘要。浮动框和任何其他框之间的边距不会合并（甚至浮动框和它的流入子框之间也不会）。任何浮动的、绝对定位的框都不会与任何其他框的边距合并（原因：它们是流外块级框）。建立新块格式化上下文的元素的边距（例如，浮动框和溢出不“可见”的元素）不会与其流入的子元素合并。（原因：不在同一个块级格式化上下文中）绝对定位框的边距不会合并（甚至不会合并它们的流入子框）将绝对定位框与飞行框进行比较，那么两个飞行的上升框必须在不同的位置高度，因此无论盒子如何移动，都不会影响任何飞行的盒子。行内框的边距不合并（甚至不合并它们的流入子项）。流入块级元素的底部边距将始终与其下一个流入块级兄弟元素的顶部边距合并，除非兄弟元素有间隙流入块级元素的顶部边距合并其第一个流入块级子元素的上边距，如果元素没有顶部边框，没有顶部填充且子元素没有间隙且“高度”为“自动”'和流入的底部边距'min-height'为0的块级框与其最后一个in-flow-block-levelchild的bottommargin合并，如果该box没有bottompadding和bottomborder并且child的bottommargin没有与有间隙的顶部边距合并。如果'min-height'属性为0，并且既没有顶部或底部边框，也没有顶部或底部填充，并且其'height'为0或'auto'，则框本身的边距也会被合并，没有linebox，并合并所有流入子元素的边距（如果有的话）。如果框的顶部和底部边距相邻，则它们可能会通过边距折叠。此时，元素的位置取决于它与边距被合并的其他元素的关系。如果元素的边距与其父元素的上边距合并，则框的上边框定义为其父元素的相同。否则，要么该元素的父级不参与边距合并，要么只涉及其父级的底部边距。如果元素的下边框不为0，则其上边框位置将正常显示（与本来一样）。请注意，已完全合并的元素的位置不会影响其他边距已合并的元素的位置。只有在布置这些元素的后代时才需要上边框的位置。整理自css2.1规范：[http://www.ayqy.net/doc/css2-...]和：[http://www.jianshu.com/p/52a2...]
