<html>
<head>
<meta http-equiv="content-type" content="text/html"; charset="utf-8" />
<meta name="description" content="浮动布局">
<style type="text/css">
#lside{
float:left;
background-color:green;
height:100px;
width:100px;
}
#rside{
float:left;
background-color:red;
height:100px;
width:100px;
}
#com{
background-color:yellow;
width:100px;
height:100px;
float:left;
clear:left; <!--取消浮动布局-->
}
#comdown{
background-color:blue;
width:100px;
height:100px;
float:left;
}
</style>
<title>浮动布局</title>
</head>
<body>
<!--往左飘--><!--产生并排的两个-->
<div>
<div id="lside">我是左</div>
<div id="rside">我是右</div>
</div>
<div>
<div id="com">我是左下</div>
<div id="comdown">我右下</div>
</div>
</body>
</html>