网页布局中使用CSS来清除浮动（代替清浮动的空元素）

说明：

通常我们使用以下方法来清除浮动：

<style>
.content{float:right}
.clear {clear:both}
</style>
<div class="content">content</div>
<div>sidebar</div>
<div class="clear"></div>
<div>footer</div>

这个方法简单有效，但是会浪费一个元素。下文是一个用CSS来清除浮动的方法，不需要添加空元素：

<style>
.content{float:right}
.footer {zoom:1; /* 触发IE的layout来清除浮动(IE专属属性，通不过W3C) */}
.footer:after { /* 标准浏览器的清除浮动 */
	content:'...';
	visibility:hidden;
	height:0;
	display:block;
	clear:both;
}
</style>
<div class="content">content</div>
<div>sidebar</div>
<div class="footer">footer</div>

＜完＞