css清除浮动影响

将清除浮动代码添加到重置样式表中，随时可以调用

1 .clearfix{margin-right:auto;margin-left:auto;*zoom:1}.clearfix:before,.clearfix:after{display:table;content:"";line-height:0}.clearfix:after{clear:both}

给需要清除浮动影响的元素添加class名 --- clearfix 例：

 1 <!-- css -->
 2     <style>
 3         .top {
 4             width: 100%;
 5             height: 200px;
 6             background-color: yellow;
 7         }
 8         .middle .content {
 9             float: left;
10             margin-top: 20px;
11             width: 100px;
12             height: 400px;
13             background-color: blue;
14         }
15         .clearfix {margin-right:auto;margin-left:auto;*zoom:1}
16         .clearfix:before,.clearfix:after {display:table;content:"";line-height:0}
17         .clearfix:after{clear:both}
18     </style>

1 <!-- html -->
2 <body>
3     <div class="top"></div>
4     <div class="middle clearfix">
5         <div class="content"></div>
6     </div>
7 </body>

来源：https://www.cnblogs.com/liguanlong/p/12007157.html

标签

clearfix

margin

css

css样式表

易学教程内所有资源均来自网络或用户发布的内容，如有违反法律规定的内容欢迎反馈！
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!