上海启嘟渡科技商贸有限公司
SEARCH

与我们合作

我们专注提供互联网一站式服务,助力企业品牌宣传多平台多途径导流量。
主营业务:网站建设、移动端微信小程序开发、营销推广、基础网络、品牌形象策划等

您也可通过下列途径与我们取得联系:

微 信: wxyunyingzhe

手 机: 15624122141

邮 箱:

css中一个div包含一个小div,如果外层的div不设border属性,里边的div上部会贴住外层div,为什么

更新时间:2025-01-11 16:52:33

  这位网友你好,你遇到的是Margin垂直外边距合并问题,外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。

  垂直外边距合并问题常见于第一个子元素的margin-top会顶开父元素与父元素相邻元素的间距,而且只在标准浏览器下

(FirfFox、Chrome、Opera、Sarfi)产生问题,IE下反而表现良好。

  这个问题发生的原因是根据规范,一个盒子如果没有上补白(padding-top)和上边框(border-top),那么这个盒子的上边距会和其内部文档流中的第一个子元素的上边距重叠。

  再说了白点就是:父元素的第一个子元素的上边距margin-top如果碰不到有效的border或者padding.就会不断一层一层的找自己

“领导”(父元素,祖先元素)的麻烦。只要给领导设置个有效的

border或者padding就可以有效的管制这个目无领导的margin防止它越级,假传圣旨,把自己的margin当领导的margin执行。

  对于垂直外边距合并的解决方案上面已经解释了,为父元素例子中的middle元素增加一个border-top或者padding-top即可解决这个问题。

  详细介绍你可以看一下下面我上传的文章,或者搜一下相关资料

多重随机标签

猜你喜欢文章

QQ客服 电话咨询