然后清除设置clear:both:.wrapper{width:500px;背景色：紫色；}.son{浮动：左；宽度：100px；高度：100px；背景色：蓝色；}.clear{clear：两者；background-color:pink;}没有花里胡哨的东西，清除浮动是用一行clear:both完成的。2.clear:both的理解如果你只看了w3school的简单说明，你可能还是不明白clear的意思。定义和用法clear属性指定元素的哪一侧不允许其他浮动元素。说明clear属性定义元素的哪一侧不允许有浮动元素。在CSS1和CSS2中，这是通过自动增加透明元素（具有透明属性集的元素）的上边距来实现的。在CSS2.1中，在元素的上边距上方添加了一个空白空间，而边距本身并没有改变。无论哪种方式，最终结果都是一样的，如果声明为left或rightcleared，都会使元素的topborder边框正好在元素的bottommargin边框的下方浮动在那一侧。MDN的介绍是：clearCSS属性指定一个元素是否必须移动（清除浮动后）在它之前的浮动元素下方。clear属性适用于浮动和非浮动元素。emmmmm...移到最下面，这个比较好理解。本来是不会移动到底部的，看MDNdemo截图：浮动本来就是为了处理周围图文的问题。一般情况下，文字应该绕着“图片”（左右）转一圈，而文字所在的div还在，还是忽略左右浮动的两个div，谁叫你们两个跑题了。但是，文本div使用clear:left后，文本div的左侧就不允许有浮动元素了。为什么不允许？自己搬地方，移到div.left的底部。浮动元素仍然允许在文本div的右侧，因此无需将其移动到div.right下面。你怎么理解这个地方？就是将文字所在的整个div移动，而不是改变文字的换行方式。不清除浮动（clear:none）是这样的：（文本所在的div用红框表示）清除左浮动（clear:left）是这样的：（文本所在的div以红框表示）因此，一个元素设置为clearFloating是指自己向下移动，不与浮动元素重叠。在移动过程中，clear元素扩展了父元素的高度。毕竟是标准流，父元素可以忽略浮动逆子，但必须包含标准流好子。另外，我们其实并不希望看到清晰的元素，也不希望它影响其他元素的观感。所以在伪元素代码中使用了content:""和height:0等其他属性来隐藏，最后清除元素是有宽无高的工具。