本文介绍了小垫,大差的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
如果我只在标题周围添加一个1像素的边距,那么这显然是一个巨大的区别()。
If I only add a 1px padding to a div around a heading, then this makes apparently a huge difference (http://jsfiddle.net/68LgP/).
html:
<div class="pad0">
<h1>Text</h1>
</div>
<div class="pad1">
<h1>Text</h1>
</div>
css:
.pad0 {
background-color: #E9E9E9;
padding: 0px;
}
.pad1 {
background-color: #E9E9E9;
padding: 1px;
}
为什么会这样?我真的想实现类似的效果,1px填充,但没有额外的填充添加。
Why is that so? I really would like to achieve a similar effect to the 1px padding but with no extra padding added.
推荐答案
您可以在。
因此,如果您应用 padding-top
( 1px
就够了),就像在第二个例子中一样,边距不再折叠。一个简单的解决方案,如已经建议的,是删除您的标题元素的默认边距。
So if you apply a padding-top
(1px
is enough), as in your second example, the margins are no longer collapsed. An easy solution, as already suggested, is to remove the default margin of your heading elements.
这篇关于小垫,大差的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!