要实现的效果：
得到的效果：
直接原因：可以看到，在这里，父元素没有兜住子元素的margin-top，但祖元素兜住了子元素的margin-top,父元素与祖元素的区别是祖元素有边框
根本原因：由于父元素没有边框（或内间距），导致父元素的盒模型没有边界，兜不住子元素margin
解决方法：给子元素一个高度为1px的哥哥元素：
其他解决办法：
1、为父元素增加padding-top样式（padding-top：1px）
2、为父元素添加overflow：hidden；样式即可
3、为父元素或者子元素声明浮动（float：left）
4、为父元素添加border（border:1px solid transparent）
5、为父元素或者子元素声明绝对定位
要实现的效果： 得到的效果： 直接原因：可以看到，在这里，父元素没有兜住子元素的margin-top，但祖元素兜住...
margin塌陷:当父级元素和子级元素的margin-top都为100px时，此时将出现子级元素不以父级元素的to...
A：今天学到的内容 一、margin的小问题 1、给子元素margin-top：父元素移动，子元素不移动。 解决方...
为父元素设置内边距padding。来代替给子元素设置margin-top 为父元素设置边框border。 为父元素...
margin top百分比 是根据父元素的宽度来计算的 如图，父元素的宽度200px,子元素margin-top:...
1.很实用，父元素相对定位，子元素绝对定位 2.父元素相对定位，子元素绝对定位，利用margin。 /*设定水平和...
1、margin的一些小问题 1.1给子元素设置margin-top:父元素移动，子元素不移动 2种解决方式 例子...
在开发中经常会遇到当父级元素设置了margin-top,子级元素再设置margin-top时，如果子元素的值小于父...
margin塌陷：当父元素包裹着子元素时，垂直方向的margin取两者之中较大的数值。解决方法：1.给父元素设置一...
1.出现现象 给子元素设置margin-top后子元素和父元素之间没有间距，反而父元素和其他元素之间有了间距，和直...
本文标题：关于父元素兜不住子元素的margin
本文链接：https://www.haomeiwen.com/subject/nplxkftx.html
网友评论