16 1.盒子 1.1元素盒子 口外边距合并 当一个元素包含在另一个元素中时(假设没有内边距或边框把外边 距分隔开),它们的上和/或下外边距也会发生合并。 合并之前 合并之后 margin-top: 20px 外边距合并 m argin-top: 20px 形成一个外边距 margin-top: 10px 内容区域 内容区域 河南中医学院/阮晓龙713938213680/http://web.51xueweb.cn
河南中医学院 / 阮晓龙 / 13938213680 / http://web.51xueweb.cn 1.盒子 外边距合并 当一个元素包含在另一个元素中时（假设没有内边距或边框把外边 距分隔开），它们的上和/或下外边距也会发生合并。 16 1.1元素盒子
1.盒子 1.1元素盒子 口外边距合并 个空元素,它有外边距,但是没有边框或填充,这种情况下,上 外边距与下外边距就碰到了一起,就会发生合并。 合并之前 合并之后 margin-top: 20px 外边距合并 m argiri-top: 20px margin-bottom 20px 形成一个外边距 河南中医学院/阮晓龙713938213680/http://web.51xueweb.cn
河南中医学院 / 阮晓龙 / 13938213680 / http://web.51xueweb.cn 1.盒子 外边距合并 一个空元素，它有外边距，但是没有边框或填充，这种情况下，上 外边距与下外边距就碰到了一起，就会发生合并。 17 1.1元素盒子
18 1.盒子 1.1元素盒子 口外边距合并 如果空元素外边距遇到另一个元素的外边距,也会发生合并。 合并之前 合并之后 margin-top: 20p 所有外边距会并 margirI-top: 20px margin-top: 20px 形成一个外逝距 margin-bottom: 20px 河南中医学院/阮晓龙713938213680/http://web.51xueweb.cn
河南中医学院 / 阮晓龙 / 13938213680 / http://web.51xueweb.cn 1.盒子 外边距合并 如果空元素外边距遇到另一个元素的外边距，也会发生合并。 18 1.1元素盒子
19 1.盒子 1.1元素盒子 口外边距合并初看上去可能有点奇怪,但实际上,它是有意义的。 如下图所示,段落之间的上外边距和下外边距就合并在一起,这样 各处的距离就一致了。 没有外逝距合并 有外迈距合并 落之间的外边距是上外边距的两倍 落之间的外边距与上外边距相同 注:只有普通文档流中块框的垂直外边距才会发生外边距合并。行内框、浮动框或绝对定位之间的外边距不会合并。 河南中医学院/阮晓龙713938213680/http://web.51xueweb.cn
河南中医学院 / 阮晓龙 / 13938213680 / http://web.51xueweb.cn 1.盒子 外边距合并初看上去可能有点奇怪，但实际上，它是有意义的。 如下图所示，段落之间的上外边距和下外边距就合并在一起，这样 各处的距离就一致了。 19 1.1元素盒子 注：只有普通文档流中块框的垂直外边距才会发生外边距合并。行内框、浮动框或绝对定位之间的外边距不会合并
20 十 2 现场演示: ■案例10-01:外边距示例 河南中医学院/阮晓龙713938213680/http://web.51xueweb.cn
河南中医学院 / 阮晓龙 / 13938213680 / http://web.51xueweb.cn 20 现场演示： 案例10-01：外边距示例