overflow:hidden这个CSS样式是大家常用到的CSS样式，但是大多数人对这个样式的理解仅仅局限于隐藏溢出，而其实它还有清除浮动这个功能。
1 <html>
2 <head>
3 <meta http-equiv="Content-type" content="text/html" charset="utf-8" />
4 <title>taobao demo</title>
5 <style type="text/css">
6 body{font:12px/1.5 tahoma,arial,sans-serif}
7 a{text-decoration: none;}
8 .search-tips{float: right;}
9 .search-tips a{color: #6c6c6c;}
10 .search-button{float:right;}
11 .btn-search{149px;height:44px;border: 0;cursor: pointer;}
12 .search-common-pannel{
13 height: 44px;
14 <!--overflow: hidden;-->
padding: 3px 0px 3px 0px; //设置边框距离
15 }
16 .search-common-pannel input{
17 height: 44px;
18 line-height: 44px;
19 100%;
20 border:0;
21 outline: 0;
22 background-color: #fff;
23 }
24 </style>
25 </head>
26 <body>
27 <div class="search-container">
28 <div class="search-pannel">
29 <form>
30 <div class="search-button">
31 <button class="btn-search" type="submit"></button>
32 </div>
33 <div class="search-common-pannel">
34 <input type="text" name="">
35 <i></i>
36 </div>
37 </form>
38 </div>
39 </div>
40 </body>
41 </html>
这段代码是一个做淘宝搜索框中的一段代码，这里overflow：hidden就起到了一个清除浮动的效果。 具体代码可以看慕课网http://www.imooc.com/video/282里的教程