.main {
width: 600px;
height: 400px;
background: #000;
}
.container {
width: 200px;
height: 200px;
background: #f00;
margin: 50px auto;
}
原因：
边距重叠：一个盒子和其子孙的边距重叠。根据规范，一个盒子如果没有上补白和上边框，那么它的上边距应该和其文档流中的第一个孩子元素的上边距重叠。
普通文档流盒子间，只要垂直外边距直接接触就会发生合并，合并后外边距视觉高度取两个发生合并外边距中较大者。发生这一现象的有三种情况：相邻兄弟块元素间、父元素及其首子元素和末子元素间（没有内边距或边框把外边距分隔开）、空块级元素自身的合并。
解决办法：
1.为父盒子设置padding
2.为父盒子设置border
3.为父盒子设置 overflow：hidden
4.为父元素设置绝对定位（position:absolute）或者浮动（不推荐 或者给子元素设置定位或者浮动 -----因为会跳出文档流）
.main { width: 600px; height: 400px; backg...
1、margin的一些小问题 1.1给子元素设置margin-top:父元素移动，子元素不移动 2种解决方式 例子...
什么是外边距重叠： 当给子元素设置margin-top的时候 父元素会跟着移动 解决方法一 触发BFC 以下条件满...
为父元素设置内边距padding。来代替给子元素设置margin-top 为父元素设置边框border。 为父元素...
A：今天学到的内容 一、margin的小问题 1、给子元素margin-top：父元素移动，子元素不移动。 解决方...
在开发中经常会遇到当父级元素设置了margin-top,子级元素再设置margin-top时，如果子元素的值小于父...
A.我今天学到了什么 一.margin的一点小问题 1.给子元素margin-top:父元素移动,子元素不移动 解...
水平居中 行内元素水平居中给它的父级元素设置 块级元素水平居中给该元素设置margin值 子元素有浮动对父元素进行...
我今天学会了 1，0:margin的一点小问题 1。给子元素margin-top:父元素移动,子元素不移动 2.上...
问题：在设置 在设置 ：margin-top时，发现父元素和子元素一起下移了40px,而且父元素和子元素的上边框重...
本文标题：CSS子元素设置margin父元素跟着移动
本文链接：https://www.haomeiwen.com/subject/odyfsctx.html
网友评论