子DIV块中设置margin-top时影响父DIV块位置

发布于 2022-09-01 19:36:33 字数 409 浏览 24 评论 0

<div class="login">
</div>

</div>

.container{

width: 100%;
height:673px;
background-image: url("../img/login.jpg");

}

.login{

width: 40%;
height: 200px;
background-color: #999;
margin-top: 100px;

}

margin-top加在login里面为什么container 也会被影响

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

只有影子陪我不离不弃 2022-09-08 19:36:33

1，因为.container没有设置border，这两个div会发生margin collapse，一个margin是0，一个是100px ,所以看起来像是.container这个div有margin一样
2，你可以设置一个border，这样的话就不会发生margin collapse,.login就会以.container作为参考进行定位啦
3，或者你可以触发.container的BFC，比如在.container中加入position:relative;或者overflow:hidden;等这样的话就不会发生margin collapse。