问题描述
只是在这里查看一些CSS，我注意到:
Just looking at some CSS here, and I noticed:
.head{position:relative;overflow:hidden;margin:-30px 0 0 -25px;width:820px;padding:20px 25px 0 25px;background:url(/images/bkg.gif) 0 0 no-repeat;}
为什么要设置-30和-25像素的边距?
Why would you put -30 and -25px margins?
推荐答案
我开始输入答案，然后找到一个更好的答案此处( Wayback机器备份).一些要点:
I started typing an answer, and then found a much better one here (Wayback Machine backup). Some salient points:
负边距:
- 是有效的CSS
- 不要中断页面流
- 具有高度的跨浏览器兼容性(尽管如果它们破坏了链接或浮动图像，请尝试添加位置:相对；这样就可以解决此问题)
它们对未浮动元素的影响:
- 将它们应用到元素的顶部或左侧，以适当的方向拉"该元素
- 但是，将它们应用于元素的底部或右边会立即将随后的元素拉入它们，使其重叠
它们对浮动元素的影响:
- 这更加复杂，我无法比文章更好地对其进行总结.在Firebug中玩耍以感受一下它们.
该文章中有一些出色的示例，其中使用了负保证金(尤其是3列布局！魔术.我使用了之前用于页面布局的类似技术.)我发现它们的最常见用法是仅移动一个元素以校正其位置，并使一个元素与另一个元素重叠视觉效果.
There are some brilliant examples of negative margin use in that article (especially the 3-column layout! Magic. I've used a similar technique for page layout before.) The most common use for them I've found is just to move an element a small amount to correct its position, and to make one element overlap another for visual effect.
这篇关于为什么要使用负边距?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！