全国旗舰校区

不同学习城市 同样授课品质

北京

深圳

上海

广州

郑州

大连

武汉

成都

西安

杭州

青岛

重庆

长沙

哈尔滨

南京

太原

沈阳

合肥

贵阳

济南

下一个校区
就在你家门口
+
当前位置:首页  >  技术干货

什么是margin重叠问题?如何解决?

发布时间:2022-09-06 17:34:03
发布人:wjy

问题描述: 两个块级元素的上外边距和下外边距可能会合并(折叠)为一个外边距,其大小会取其中外边距值大的那个,这种行为就是外边距折叠。需要注意的是,浮动的元素和绝对定位这种脱离文档流的元素的外边距不会折叠。重叠只会出现在垂直方向

计算原则: 折叠合并后外边距的计算原则如下:

如果两者都是正数,那么就去最大者如果是一正一负,就会正值减去负值的绝对值两个都是负值时,用0减去两个中绝对值大的那个

 

什么是margin重叠问题?如何解决?

解决办法: 对于折叠的情况,主要有两种:兄弟之间重叠父子之间重叠

 

1、兄弟之间重叠

底部元素变为行内盒子:display: inline-block底部元素设置浮动:float底部元素的position的值为absolute/fixed

2、父子之间重叠

父元素加入:overflow: hidden父元素添加透明边框:border:1px solid transparent子元素变为行内盒子:display: inline-block子元素加入浮动属性或定位

相关文章

什么是敏捷开发之Scrum框架?

什么是敏捷开发之Scrum框架?

2023-10-14
敏捷中的故事编写工作坊是什么?

敏捷中的故事编写工作坊是什么?

2023-10-14
scrum master的核心竞争力是什么?

scrum master的核心竞争力是什么?

2023-10-14
什么项目适合使用Scrum?

什么项目适合使用Scrum?

2023-10-14

最新文章

常见网络安全面试题:Windows常用的命令有哪些?

常见网络安全面试题:Windows常用的命令有哪些?

2023-10-09
常见网络安全面试题:根据设备告警如何展开排查?

常见网络安全面试题:根据设备告警如何展开排查?

2023-10-09
常见网络安全面试题:mysql加固呢?(数据库加固)

常见网络安全面试题:mysql加固呢?(数据库加固)

2023-10-09
常见网络安全面试题:windows和linux加固?(操作系统加固)

常见网络安全面试题:windows和linux加固?(操作系统加固)

2023-10-09
在线咨询 免费试学 教程领取