<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>浮动 float </title>
<style type="text/css">
*{margin:0;padding:0;}
#wrap{width:700px;height:600px;}
#div1{background:red;width:200px;height:200px;float:left;}
#div2{background:blue;width:300px;float: left;height:300px;}
#div3{background:green;width:400px;height:400px;clear:both;}
</style>
</head>
<body>
<div id="wrap">
<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
</div>
<html>
<head>
<meta charset="utf-8">
<title>浮动 float </title>
<style type="text/css">
*{margin:0;padding:0;}
#wrap{width:700px;height:600px;}
#div1{background:red;width:200px;height:200px;float:left;}
#div2{background:blue;width:300px;float: left;height:300px;}
#div3{background:green;width:400px;height:400px;clear:both;}
</style>
</head>
<body>
<div id="wrap">
<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
</div>
</body>
具体结果如图所示
</html>