CSS边缘如何工作? [英] How does CSS margin work?
问题描述
在下面的代码中,不应该在 .box1
和 .box2
之间的距离为 20像素 作为 .box1
具有10px底部边距并且 .box2
具有10px顶部边距。
< div class =box>
< div class =box1>< / div>
< div class =box2>< / div>
< / div>
CSS:
.box1 {
margin-bottom:10px;
}
.box2 {
margin-top:10px;
}
不,页边距只有10px 2盒。
你说的是同样的东西两次,盒子1下面必须有10px的余量
和必须有一个b / b
像这样想:
有2个人,Harry和Sally 。哈利站在离萨利10英尺的地方。莎莉离哈利有多远?是的,你知道了,10英尺!
In the following code, shouldn't the margin between .box1
and .box2
be 20px as the .box1
has 10px bottom margin and .box2
has 10px top margin.
<div class="box">
<div class="box1"></div>
<div class="box2"></div>
</div>
CSS:
.box1{
margin-bottom: 10px;
}
.box2{
margin-top: 10px;
}
No, the margin will only be 10px between the 2 boxes.
You are saying the same thing twice , "that there must be a margin of 10px below box 1" and "that there must be a margin of 10px above box2"
Think of it like this :
There are 2 people, Harry and Sally. Harry is standing 10 feet from Sally. How far is Sally away from Harry? Yep, you got it, 10 feet!
这篇关于CSS边缘如何工作?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!