css排版时出现：里面的div设置margin-top值时外面div会向下移动相应距离这是为啥 请哪位高手帮帮忙
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了css排版时出现：里面的div设置margin-top值时外面div会向下移动相应距离这是为啥 请哪位高手帮帮忙相关的知识，希望对你有一定的参考价值。
<body>
<div class="logon">
<div class="log_bk">
</div>
</div>
</body>
body margin:0 auto; padding:0px; background:#0A76B0;
#logon background:url(../images/logon-bk.jpg) no-repeat left top;
height:865px; width:1251px;
.log_bk background:url(../images/01.png) no-repeat left top; height:380px;
height:270px; margin:300px 0 180px 460px;
因为背景是图案所以要设置高度，我把#logon的背景定位在顶部也不行。
因为logon和log_bk垂直方向的margin合并了，如果设置了logon的padding为1px就可以避免margin合并。追问
好了，刚才把padding值加到里面的div了，不过两个div的margin值为什么会合并呢？
追答恩，刚才我写错了，写成里面的了。。
这个是css标准规定的，垂直方向的margin会合并。
比如你有很多段落，margin是10px，其实第一段上面的margin和最后一段下面的margin是10px，且段与段之间的margin也是10px，css标准就是为了保持这个margin一致才规定垂直方向margin要合并。
margin合并时会取最大的那个margin，所以合并后logon的margin-top也成了300px了。
哦，明白了，谢谢。
参考技术A 因为margin叠加了，你给外边的盒子一个border或者padding就好了，这个叫空白边叠加，你可以具体问度娘一下DW在使用css+div排版时，为啥有的div标签不在固定位置呢，网页放大后，就会移动，求高手解答！谢谢
尤其在div标签嵌套时，排版就混乱了！
这个呀，那应该是定位的问题吧。是不是用的绝对定位（用DW的“层”也是一样的）了呢。这个应该也是比较好解决的，用一下“相对定位的绝对定位”就好了。也就是，把外层标签弄成“相对定位”。比如：
<div>
<div></div>
</div>
如果里面的DIV是绝对定位的话，你把外面的那个DIV弄成相对定位就好了。
就是这样了。
如果还有问题，或是我说的你不明白，你再Q我（Q号我的资料里有写）好了，我也可以简单的指导下你的学习。 参考技术A 那是有浮动的原因！ 参考技术B 你div的位置设置的是绝对定位吧 参考技术C 请把代码放上来要不然不知道什么问题。
以上是关于css排版时出现：里面的div设置margin-top值时外面div会向下移动相应距离这是为啥 请哪位高手帮帮忙的主要内容，如果未能解决你的问题，请参考以下文章
div-map-area的html中，如何写CSS能让鼠标滑过area的超链接时出现效果？
DW在使用css+div排版时，为啥有的div标签不在固定位置呢，网页放大后，就会移动，求高手解答！谢谢