课程
/前端开发
/HTML/CSS
/初识HTML(5)+CSS(3)-升级版
为什么在#box1{margin-bottom:30px};下加一行#box2{margin-top:30px};不会再增加间距
2016-07-12
源自:初识HTML(5)+CSS(3)-升级版 12-13
正在回答
margin是盒子间的距离,设置BOX1之后,就代表了二者距离30PX,这时再设置BOX2的距离为30PX就不显示,,可以这样理解,你把A放在B的右下边30cm,那B是不是间接的已经满足在A上边30cm了?说的复杂了,大概就是酱紫的
qq_快乐小子_3 提问者
box1底部距离box2顶部30
box2顶部距离box1底部30
两者是同一个意思
所以间距只是30 不会增加
我发现两个box共享了他们之间那一部分margin,你如果把box2的margin-top改成40px,就会发现间距增加了10.但是#box1{margin-bottom:30px};和#box2{margin-top:30px};效果是一样的。
两个盒子所移动的相当于抵消了
#box1{margin-bottom:30px};指的是box2在box1下30px
#box2{margin-top:30px};指的是box1在box2上30px同样的意思换了个说法而已
举报
HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义
6 回答为什么写#box1{margin-bottom:30px;} 可以实现两个div而不写#box1{margin-bottom:30px;}#box2{margin-bottom:30px;}
5 回答#box1{margin-bottom:30px;}
8 回答#box1{margin-bottom:30px;}
2 回答#box1{margin-bottom:30px;}
4 回答.box1{margin-bottom:30px;}为什么不对