zoukankan html css js c++ java

clearfix清除浮动

在开发html页面时，我们经常会用到css的清除浮动，这里我推荐一种版本的清除方法，个人感觉非常好用。

.clearfix:before,.clearfix:after{
    content:"";
    display:table;
}
.clearfix:after{clear:both;}
.clearfix{
     *zoom:1;
}

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>reset</title>
 6     <style>
 7     *{margin:0;padding:0;}
 8     .clearfix:before,.clearfix:after{
 9         content:"";
10         display:table;
11     }
12     .clearfix:after{clear:both;}
13     .clearfix{
14         *zoom:1;
15     } 
16     .box{border:1px red solid;width:200px;}
17     .con{float:left; margin-top: 10px;}
18     </style>
19 </head>
20 <body>
21     <div class="box clearfix">
22         <div class="con">清除浮动</div>
23     </div>
24 </body>
25 </html>

查看全文

相关阅读:
移动端轮播插件
 一个简单的富文本编辑器
 animation css3
渐变的写法
 js拖拽功能
 打子弹游戏 js
css-vertical-centering
css3的linear-gradient
js模拟滚动条
 js日历

原文地址：https://www.cnblogs.com/dibaosong/p/4577984.html