<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>消除浮动影响</title>
<style type="text/css">
??#d0,p{
???border: 1pX solid red;
???width: 400PX;
??}
??#d1,#d2,#d3{
??????width:100px;
??????height: 100PX;
??????margin: 10PX; ????
??}
??#d1{
?????background-color: #f00; ??
??}
??#d2{
?????background-color: #0f0; ??
??}
??#d3{
?????background-color: #00f; ??
??}
??/*浮动*/
??#d1,#d2,#d3{
??float: left;
??}
??/*消除浮动影响：
??在哪个元素上加clear，则该元素就不受影响，他会出现在所有浮动元素的下方*/
?#d4{
??clear: left;
??}
</style>
</head>
<body>
<div id="d0">
???<div id="d1"></div>
???<div id="d2"></div>
???<div id="d3"></div>
???<div id="d4"></div>
</div>
???<p>浮动时看看我的位置在哪里</p>
</body>
</html>
CSS—DIV浮动定位 消除影响
原文地址：http://www.cnblogs.com/Bighua123/p/7591491.html