如何从原理上解释外边距折叠问题的产生？

Question

在我刚刚学习前端的时候接触过边距折叠问题 知道可以触发bfc去解决 今天回顾以前写的文章时我突然想知道为什么会产生外边距折叠 不是指触发情况 这个我知道就是从浏览器的渲染机制上或者说从原理上来讲为什么会产生边距折叠以下是一些概念：外边距折叠：指的是毗邻的两个或多个外边距 (margin) 在垂直方向会合并成一个外边距。可以通过以下方式阻止：在父层div加上：overflow:hidden；把margin-top外边距改成padding-top内边距;父元素产生边距重叠的边有不为 0 的 padding 或宽度不为 0 且 style 不为 none 的 border，父层div加：padding-top: 1px,或者 border-top:1px ;设置父元素或子元素浮动（left/right）设置父元素dispaly:inline-block或者display:table-cell;给父元素加上绝对定位 也就是让它不在满足外边距坍塌所需条件或者触发BFC来解决外边距坍塌问题折叠产生的情况如下：必须是处于常规文档流（非float和绝对定位）的块级盒子,并且处于同一个BFC当中。没有线盒，没有空隙，没有padding和border将他们分隔开(ps :所以解决办法中有padding或者border两种办法)都属于垂直方向上相邻的外边距

Answer 1

算是个历史遗留问题。引用一篇文章的话

CSS的基本模型是排版。只是前端工程师现在做得更多的是 布局 而非 文字排版，但CSS并未界定这两者的区别。而 margin 折叠是为实现文本排版的段落间距而提供的特性。