<div class="news clear">
<img src="news-pic.jpg" />
<p>some text</p>
</div>
在使用CSS方法时，结合使用:after伪类和内容声明在指定的现有内容的末尾添加新的内容。在这个示例中，我添加了一个句点，因为它是个非常小的不引人注意的字符。不希望新内容占据垂直空间或者在页面上显示，所以需要将height设置为0，将visibility设置为hidden。因为被清理的元素在它们的顶空白边上添加了空间，所以生成的内容需要将它的display属性设置为block。
这样设置之后，就可以对生成的内容进行清理：
.clear:after {
content: ".";
height:0;
visibility: hidden;
display: block;
clear:both;
}
这个方法在大多数现代浏览器中是有效的，但是在IE 6和更低版本中不起作用。有各种解决方案，其中许多记录在www.positioniseverything.net/easyclearing.html中。最常用的解决方案涉及使用Holly招数（见第8章），从而迫使IE 5-6应用“布局”（见第9章）和不正确地清理浮动元素。
.clear{
display: block;
}
/* holly hack targets ie win only \*/
* html .clear {height:1%;}
.clear {display:block;}
/* end holly hack */
但是，由于其复杂性，这个方法可能不适合所有人采用。
对JavaScript方法的解释超出了本书的范围，但是需要简要地提及一下。与前面的方法不同，JavaScript方法在所有主流浏览器上都是有效的（在打开脚本功能的情况下）。但是，如果使用这个方法，就需要确保在关闭脚本功能的情况下内容仍然是可读的。
2.3 小结
在本章中，学习了框模型的一些性质。看到了相邻垂直空白边的叠加如何形成单一空白边，以及Windows上的IE 5.x如何以与其他浏览器不同的方式解释width属性。理解了绝对定位和相对定位之间的差异，以及在相对定位的容器中进行绝对定位是多么有用。最后，还看到了浮动在各种情况下的表现，学习了如何通过增加顶空白边对元素进行清理。
具备了这些知识之后，我们就可以开始运用它们了。在本书的下一部分中，我们将讲解许多CSS核心概念，你将看到如何使用这些概念创建各种有用且实用的技术。打开惯用的文本编辑器，我们要开始编程了。
购买《精通CSS:高级Web标准解决方案》：http://shop.csai.cn/itbook/itbookinfo.asp?lbbh=10014414