子元素设置margin-top,父元素跟着一起移动

教程大全  / 倒序浏览   ©

#楼主# 2020-2-19

跳转到指定楼层

马上注册,分享更多源码,享用更多功能,让你轻松玩转云大陆。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

原因
边距重叠:一个盒子和其子孙的边距重叠。根据规范,一个盒子如果没有上补白和上边框,那么它的上边距应该和其文档流中的第一个孩子元素的上边距重叠。

普通文档流盒子间,只要垂直外边距直接接触就会发生归并,归并后外边距视觉高度取两个发生归并外边距中较大者。发生这一现象的有三种情况:相邻兄弟块元素间、父元素及其首子元素和末子元素间(没有内边距或边框把外边距分隔开)、空块级元素自身的归并。

解决办法:

1.为父盒子设置padding

2.为父盒子设置border

3.为父盒子设置 overflow:hidden

4.为父元素设置绝对定位(position:absolute)或者浮动(不推荐 或者给子元素设置定位或者浮动 -----因为会跳出文档流)

https://www.jianshu.com/p/cda0c004b682

分享淘帖
回复

使用道具

您的回复是对作者最大的奖励

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关于作者

escape_lot

新手猿

  • 主题

    3

  • 帖子

    3

  • 关注者

    0

Archiver|手机版|小黑屋|云大陆 | 赣ICP备18008958号-4|网站地图
Powered by vrarz.com!  © 2019-2020版权所有云大陆