问答详情
源自:12-13 距离产生美 - 使用margin为盒子设置外边距(边界)

为什么在#box1{margin-bottom:30px};下加一行#box2{margin-top:30px};不会再增加间距

为什么在#box1{margin-bottom:30px};下加一行#box2{margin-top:30px};不会再增加间距

提问者:qq_快乐小子_3 2016-07-12 10:12

个回答

  • 慕粉18602724285
    2016-07-12 10:29:56
    已采纳

    margin是盒子间的距离,设置BOX1之后,就代表了二者距离30PX,这时再设置BOX2的距离为30PX就不显示,,可以这样理解,你把A放在B的右下边30cm,那B是不是间接的已经满足在A上边30cm了?说的复杂了,大概就是酱紫的

  • qq_小安安_03642058
    2016-07-12 10:45:26

    http://img.mukewang.com/5784593f0001a9b309300123.jpg

    box1底部距离box2顶部30

    box2顶部距离box1底部30   

    两者是同一个意思

    所以间距只是30   不会增加


  • 慕水融融
    2016-07-12 10:42:34

    我发现两个box共享了他们之间那一部分margin,你如果把box2的margin-top改成40px,就会发现间距增加了10.但是#box1{margin-bottom:30px};和#box2{margin-top:30px};效果是一样的。

  • 晨哥是梅西
    2016-07-12 10:35:26

    两个盒子所移动的相当于抵消了

  • leia1
    2016-07-12 10:34:12

    #box1{margin-bottom:30px};指的是box2在box1下30px

    #box2{margin-top:30px};指的是box1在box2上30px同样的意思换了个说法而已