之前自己对于清除浮动的用法比较模糊 ，如果用到的话，一般都是采用简单粗暴的方式解决，就是直接用overflow：hidden，但是越用久就会发现其实有BUG，这个BUG正是overflow：hidden带来的，因为细究overflow：hidden还有一个默认效果是溢出隐藏.,如果要在子元素里再添一个div，div往下移动的话，超过了子元素的高度就会做溢出隐藏处理，所以效果不佳，所以后来自学了另一种清除浮动的方法，就是伪类.clearFix:after{content:'.';height:0;clear:both;visibility:hidden;display:block;}。这种方法比较OK的，之前的BUG不会出现，只是在做网页的时候，一定要记住一点，就是伪类的兼容性问题，ie6是不支持主要的写法的，所以加.clearFix{*zoom:1;}.只是自己的一些理解！与君共勉！

对clear float 的理解的更多相关文章

  1. CSS3 float深入理解浮动资料整理

    CSS浮动(float,clear)通俗讲解 CSS 浮动 CSS float浮动的深入研究.详解及拓展(一) CSS float浮动的深入研究.详解及拓展(二) 1.浮动实现图文环绕(理解难点) 浮 ...

  2. 对css中clear元素的理解

    clear:left;表示左侧不能有浮动元素. clear:right;表示右侧不能有浮动元素. clear:both;表示左右两侧都不能有浮动元素. 但在使用时,还得考虑css优先级问题.相同类型选 ...

  3. 转载：Clear Float

    众所周知,平时在写HTML代码时,难免少不了使用Float样式,这样一来,假使您没有清除浮动,那么有浮动元素的父元素容器将元素将无法自动撑 开.换句简单好理解的话来说,假如你在写CODE时,其中div ...

  4. 对float的理解

    从IE6下的双边距引出 对一个div设置float:left;同时设置了margin-left:100px时在IE6下会出现双边距. 有两种解决办法: 1,推荐办法.加display:inline 2 ...

  5. 关于css中float的理解

    感觉css里的float是个非常神奇的东西,神奇之处在于,你知道它是什么意思,但是用的时候总是不知道怎么实现效果.又或者它会很容易地影响到别的元素和属性.所以今天打算尝试一下float的各种设置,看看 ...

  6. 典型的检查对float精度理解的代码

    -rand()%); vy = ); vz = ); pList_particle[i].m_velocity = Vector3(vx,vy,vz); ... 1,3行代码的vx和vz的值域可以通过 ...

  7. css样式 float的理解

    float w3cSchool里解释说, 浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止.由于浮动框不在文档的普通流中,所以文档的普通流中的块框表现得就像浮动框不存在一样 ...

  8. CSS demo:flaot & clear float

    1,首先,我们布局主要的div块: 例如以下代码所看到的,我们在body里面写3几个基本div块,然后设置一些基本属性: 效果图: 2,增加基本浮动 如今我们想让红色div放到绿色div右边,我们在两 ...

  9. float的理解

    1.浮动包裹性——浮动具有让元素按displya:inline-block显示(如果没有设置宽度和高度,则它可以显示的尽量窄高 度尽量小).2.浮动破坏性——浮动元素漂浮在标准流之上(但没有脱离文档流 ...

随机推荐

  1. java 基础知识五 数组

    java  基础知识五  数组 数组保存的是一组有顺序的.具有相同类型的数据. 同一个数组中所有数据元素的数据类型都是相同的. 可以通过数组下标来访问数组,数据元素根据下标的顺序,在内存中按顺序存放 ...

  2. firefox上安装selenium ide失败

    Selenium 初学者第一步: 最近在学习selenium,但是在安装的时候遇到了问题.我是直接在firefox安装的Selenium IDE ,虽然下载安装之后存在于扩展中,但是工具栏里并没有显示 ...

  3. --save 和 --save-dev的区别

    --save是对生产环境所需依赖的声明(开发应用中使用的框架,库,比如jquery,bootstrap等) --save-dev是对开发环境所需依赖的声明(构建工具,测试工具,比如babel,gulp ...

  4. php基础知识--2017-04-14

    1.Php的两种打开方式: 第一种方式:http://localhost/0414/qq.php 第二种:新建站点,选到www目录.点击服务器----+添加-------选择本地网络   ------ ...

  5. ios animation 动画效果实现

    1.过渡动画 CATransition CATransition *animation = [CATransition animation]; [animation setDuration:1.0]; ...

  6. ThreadLocal学习笔记

    首先,ThreadLocal是Java语言提供的用于支持线程局部变量的标准实现类.很多时候,ThreadLocal与Synchronized在功能上有一定的共性,都可以用来解决多线程环境下线程安全问题 ...

  7. sql中 datediff的使用

    简介:我们在sql中经常要判断年或者月或者日是否相等,我们可以用datediff函数,使用很方便 datediff:判断年或月或日或周.星期.小时.分钟等的差别数使用格式: DATEDIFF(date ...

  8. sql中的复制函数REPLICATE

    REPLICATE函数: REPLICATE(字符串,次数)复制一个字符串n次 ) --输出结果:0000000000

  9. struts2 之 Action的优化配置

    总结:struts2种action的配置文件会随着业务的增加而增加,导致配置文件膨胀.struts2中提供了三种方案来解决这个问题: 1. 动态方法调用来实现. 2. 通配符配置来解决. 3. 使用注 ...

  10. Lambda表达式效率问题

    原文 http://www.importnew.com/17262.html 有许许多多关于 Java 8 中流效率的讨论,但根据 Alex Zhitnitsky 的测试结果显示:坚持使用传统的 Ja ...