有什么需要改的吗

<html>
	<head>
		<meta charset="UTF-8"/>
		<title>简单练习</title>
	
	<style type="text/css">
		div {
			width: 800px;
			height: auto;
			border: 1px dashed lightgray ;
			height: 380px;
		}
		.div1 {
			border: 1px solid lightgray;
			width: 240px;
			float: left;
			margin: 20px 0 20px 20px;
			text-align: center;		
			height: 160px;
		}
		.div2 {
			border: 1px solid lightgray;
			width: 240px;
			height: 160px;
			float: left;
			margin: 0 0 20px 20px;
			text-align: center;
		}
	</style>
	</head>
	<body>
		<div>
			<div class="div1">
				<img src="img/q1.jpg"/>欢迎来慕课网学习新知识！
			</div>
			<div class="div1">
				<img src="img/q2.jpg"/>欢迎来慕课网学习新知识！
			</div>
			<div class="div1">
				<img src="img/q3.jpg"/>欢迎来慕课网学习新知识！
			</div>
			<div class="div2">
				<img src="img/q1.jpg"/>欢迎来慕课网学习新知识！
			</div>
			<div class="div2">
				<img src="img/q2.jpg"/>欢迎来慕课网学习新知识！
			</div>
			<div class="div2">
				<img src="img/q3.jpg"/>欢迎来慕课网学习新知识！
			</div>
		</div>
	</body>
</html>

慕后端0484621 2017-09-01

源自：Float浮动 3-2 编程练习

收起

2回答

慕丝3243066 2017-09-02 00:03:05

第一个div设置class="box"，另外div1和div2的class="pic"，在style中只设置这两个为float=left。

收起回答

imooc_澈 2017-09-01 18:04:26

您好，页面效果展示的很漂亮，可以再在最后一个</div>前面加<div class="clear"></div>，style设置里加

.clear{

clear: both;

}

用来清除浮动。

收起回答

Michelleqyh #1

请问这里新加一个div并且这里的clear:both是不是让这个div另起一行？不应该跑到第三行上去了吗？而且这个新的div里面除了clear什么样式都没有，我觉得它应该没有效果，有什么用呢？

2017-11-18 19:36:40
guly 回复 Michelleqyh #2

你好，这个是清楚浮动的作用，祝学习愉快！

2017-11-19 12:29:29
Michelleqyh 回复 guly #3

为什么要清除浮动？

2017-11-19 19:53:35