思洋互动网站建设学前班

本文向大家描述一下清除CSS float浮动的方法，主要包括使用空标签清除浮动，使用overflow属性，使用after伪对象清除浮动三种，希望本文介绍对你有所帮助。

清除浮动的三种方法

先看一下下面代码：

viewsourceprint?

1. 01<style> 
2.  
3. 02*{margin:0;padding:0;font-size:14px;}  
4.  
5. 03ul.nav{background:red;list-style:none;}  
6.  
7. 04ul.navli{float:left;background:#FF9;margin:2px5px;}  
8.  
9. 05p{background:blue;color:#FFF;}  
10.  
11. 06</style> 
12.  
13. 07  
14.  
15. 08<ulclassulclass="nav"> 
16.  
17. 09  
18.  
19. 10<li>首页</li> 
20.  
21. 11  
22.  
23. 12<li>我的日志</li> 
24.  
25. 13  
26.  
27. 14<li>我的相册</li> 
28.  
29. 15  
30.  
31. 16<li>我的心情</li> 
32.  
33. 17  
34.  
35. 18<li>个人中心</li> 
36.  
37. 19  
38.  
39. 20</ul> 
40.  
41. 21  
42.  
43. 22<p>这里不是导航的内容</p> 
44.  

页面显示如下：
广州网站建设,网站建设,广州网页设计,广州网站设计

如何解决以上问题呢？唯一的办法就是清除浮动。