设置 display:block; 之后，div的margin为10px，

首页课程实战体系课手记专栏慕课教程

来源：4-1 display属性

simon_coding

2019-03-31 20:15:21

那么相邻div之间的距离不是应该为10px 吗？

为什么这个图里看着，相邻的距离为20px？

之前视频里说两个元素相邻的距离为较大的那个margin值。

.div1{
    margin-bottom:10px;
}
.div2{
    margin-top:20px;
}
div12 之间的距离为20px

写回答

2回答

好帮手慕夭夭

2019-04-01

已采纳

你好同学，同学描述的情况属于margin重叠，当两个块级元素设置了margin之后，垂直方向的间距会重叠，但是视频中给元素设置成了 display: inline-block;，行内块元素就不会有这个特点了。可以自己测试一下：

转换为行内快元素：

祝学习愉快，望采纳。

wangdaw92

2019-04-01

说的是垂直方向上

hangdaw92

himon_coding

h 垂直方向是根据你div2 设置的margin-top：20px来显示的，垂直方向上是按照较大值来决定外边距的

h019-04-01

共2条回复

0 学习 · 40143 问题

相似问题

回答 2

回答 2

回答 1

回答 3

回答 2