解决崩溃问题:这里给外div设置一个左浮动为什么就没有了崩溃?还有这个溢出的设置5-1没有提到啊,这是什么原理?
来源：4-11 编程练习
别了娜塔莎
2021-01-28 18:01:44
<!DOCTYPE html>
<html>
<head>
<!-- 此处编写样式 -->
<style type="text/css">
#div{
width: 806px;
border: 1px dashed;
/*overflow: hidden;*/
float: left;
margin:0px auto;
padding-bottom: 20px;
}
#div1{
float: left;
margin-left: 20px;
margin-top: 20px;
border:1px solid;
}
p{
margin: 0px;
}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div id="div">
<div id="div1">
<img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg"/>
<p>欢迎来到慕课网学习新知识!</p>
</div>
<div id="div1">
<img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg"/>
<p>欢迎来到慕课网学习新知识！</p>
</div>
<div id="div1">
<img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg"/>
<p>欢迎来到慕课网学习新知识！</p>
</div>
<div class="clearDiv" id="div1">
<img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg"/>
<p>欢迎来到慕课网学习新知识!</p>
</div>
<div id="div1">
<img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg"/>
<p>欢迎来到慕课网学习新知识！</p>
</div>
<div id="div1">
<img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg"/>
<p>欢迎来到慕课网学习新知识！</p>
</div>
</div>
</body>
</html>
1回答
-
同学你好，给外div设置左浮动后，由于外div和里面的内容都浮动了，所以外div会包括里面的内容。
给外div设置浮动，让父元素一起浮动是解决外div崩溃的其中一种方式，但这种方式会影响整体页面布局，因为外div可能有父元素，这样可能会导致整个页面都浮动，我们一般不建议这么做。
祝学习愉快~
0
相似问题