CSS-浮动与父级边框塌陷问题
更新时间：2020-09-13 11:22:18 来源： 阅读量：
【摘要】 CSS-浮动与父级边框塌陷问题考必过小编为大家整理了关于CSS-浮动与父级边框塌陷问题的信息，希望可以帮助到大家！
CSS-浮动与父级边框塌陷问题
标签：order边框html使用解决方案设置问题固定p
浮动
块级元素：独占一行
h1~h6 p p 列表...
行内元素：不独占一行
span a img strong...
行内元素可以被包含中块级元素中。
父级边框塌陷问题
解决方案：
1.增加父级元素的高度
#father{
border:1px #000 soild;
height:800px;
}
2.增加一个空的p标签，清除浮动
<p class="clear"></p>
.clear{
clear:both;
margin:0;
padding:0;
}
3.overflow
在父级元素中增加一个 overflow: hidden;
4.父类添加一个伪类：after
#father:after{
content:‘‘;
display:block;
clear:both;
}
小结：
1.浮动元素后面增加空p
简单，代码中尽量避免空p
2.设置父元素的高度
简单，元素假设有了固定的高度，就会被限制
3.overflow
简单，下拉的一些场景避免使用
4.父类添加一个伪类：after（推荐）
CSS-浮动与父级边框塌陷问题
标签：order边框html使用解决方案设置问题固定p
以上就是CSS-浮动与父级边框塌陷问题的内容，更多资讯请及时关注考必过网站，最新消息小编会第一时间发布，大家考试加油！