最理想的方式为

伪类 + content ：

　　例如 div：after{content:"";display:block;clear:both;}

　　　　div{zoom：1;}

另外，还有一些其他方式，但存在兼容性问题或不利于扩展

2.加高 扩展性不好

3.给父级加浮动，则需要给父级，再往上推找父级都加上浮动，不但繁琐，而且会导致margin左右auto失效；

4.空标签 或 br+clear：all的方式需要额外添加标签

5.voerflow:hidden;并配合zoom=1以兼容ie6&7 , 存在的问题

web - 清除浮动的更多相关文章

  1. 第五篇：web之前端之float的几种清除浮动方式

    前端之float的几种清除浮动方式   前端之float的几种清除浮动方式 本节内容 1.float清除方式1 2.float清除方式2 3.float清除方式3 4.float清除方式4 1.flo ...

  2. [Web 前端] 018 css 清除浮动的四种方法

    清除浮动的四种方法 加 clear: ...(见例1) 父级上增加属性 overflow:hidden(见例2.1) 在最后一个子元素的后面加一个空的 div,给它一个样式属性 clear: both ...

  3. 【Web】网页清除浮动的方法

    网页中,经常用浮动的div来布局,但是会出现父元素因为子元素浮动引起内部高度为0的问题,为了解决这个问题,我们需要清除浮动,下面介绍4中清除浮动的方法. 在CSS中,clear属性用户清除浮动,语法: ...

  4. [Web 前端] CSS篇之2. 清除浮动，什么时候需要清除浮动，清除浮动都有哪些方法

    cp: https://blog.csdn.net/zengyonglan/article/details/53304487 2. 清除浮动,什么时候需要清除浮动,清除浮动都有哪些方法 ? 一.什么时 ...

  5. WEB学习-CSS清除浮动

    浮动的清除 来看一个实验:现在有两个div,div身上没有任何属性.每个div中都有li,这些li都是浮动的. <div> <ul> <li>HTML</li ...

  6. css清除浮动大全共8种方法

    原文链接http://www.jb51.net/css/173023.html 清除浮动是每一个 web前台设计师必须掌握的机能.css清除浮动大全,共8种方法. 浮动会使当前标签产生向上浮的效果,同 ...

  7. CSS清除浮动八种方法

    在各种浏览器中显示效果也有可能不相同,这样让清除浮动更难了,下面总结8种清除浮动的方法,测试已通过 ie chrome firefox opera,需要的朋友可以参考下 清除浮动是每一个 web前台设 ...

  8. css清除浮动方法大全

    清除浮动这个问题,做前端的应该再熟悉不过了,也是每一个web前台设计师 必须掌握的机能. 为什么浮动这么难? 因为浮动会使当前标签产生向上浮的效果,同时会影响到前后标签.父级标签的位置及 width ...

  9. css清除浮动的八大方法

    清除浮动是每一个 web前台设计师必须掌握的机能.css清除浮动大全,共8种方法. 浮动会使当前标签产生向上浮的效果,同时会影响到前后标签.父级标签的位置及 width height 属性.而且同样的 ...

随机推荐

  1. Android Studio优化之启用Shift+Ctrl+O导入所有的包

    在使用Eclipse开发Android应用时,开发者往往会使用Shift+Ctrl+O快捷键来快速导入所有的包,和移除已经导入但还未使用的包.但这个快捷键在Android Studio没人是给有开启的 ...

  2. C语言的本质（1）——计算机与二进制

    人类的计数方式通常是"逢十进一",称为十进制(Decimal),大概因为人有十个手指,所以十进制是最自然的计数方式,各民族的文字中都有十个数字,而阿拉伯数字0-9是目前最广泛采用的 ...

  3. poj2136

                                                                           Vertical Histogram Time Limit ...

  4. linux下主要是VirtualBox及GuestAdditions的安装

    Linux版本的VirtualBox下载:http://www.virtualbox.org/wiki/Linux_Downloads.请下载对应的版本. RedHat.RHEL:rpm -i vh ...

  5. 全国计算机等级考试二级教程-C语言程序设计_第8章_地址和指针

    面试: unsigned int *p1 = &num; int *p2 = &num; #define _CRT_SECURE_NO_WARNINGS #include<std ...

  6. python 访问器@property的使用方法

    @property 可以将python定义的函数"当做"属性访问,从而提供更加友好访问方式,但是有时候setter/getter也是需要的 假设定义了一个类Cls,该类必须继承自o ...

  7. 剖析magento中关于Email模板的设置

    public function send()    {        $emailTemplate = Mage::getModel('core/email_template');        // ...

  8. 楼天城楼教主的acm心路历程（作为励志用）

    楼主个人博客:小杰博客 利用假期空暇之时,将这几年GCJ,ACM,TopCoder 參加的一些重要比赛作个 回顾.昨天是GCJ2006 的回顾,今天时间上更早一些吧,我如今还清晰记得3 年 前,我刚刚 ...

  9. fs读取某个json文件的数据

    /** * Created by Administrator on 2016/7/12. * 流数据 */ var fs = require('fs'); var stream = fs.create ...

  10. TreeSet()详解

    TreeSet()详解   1.TreeSet原理:   /* * TreeSet存储对象的时候, 可以排序, 但是需要指定排序的算法 *  * Integer能排序(有默认顺序), String能排 ...