例：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8"/>
<style>
body{margin:0;padding:0;}
.div0{width:400px;background-color:skyblue;}
.div2,.div3{width:100px;height:100px;background-color:red;float:left;}
</style>
</head>
<body>
<div class="div0">
<div class="div2"></div>
<div class="div3"></div>
</div>
</body>
</html>此时父元素div0无法包含子元素，解决办法：
1.给父元素设置overflow
.div0{overflow: hidden;}
2.增加一个子元素，设置clear: both;
<div style="clear:both"></div>
3.给父元素设置float
.div0{float:left;}
缺陷：需要给父元素设置宽度。
4.移动端经常使用的方法
给父元素添加类class="clearfix"
.clearfix::after,.clearfix::before{
content: "";
height:0;
line-height: 0;
display: block;
visibility: hidden;
clear: both;
}
/*伪元素before相当于在当前元素的第一个子元素前插入一个元素，after则是在之后插入一个元素*/
//注：为区分伪类和伪元素css3提出伪元素使用::,因此为了兼容IE8及以下，应使用:after和:before。
519
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
