之前自己对于清除浮动的用法比较模糊 ，如果用到的话，一般都是采用简单粗暴的方式解决，就是直接用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. jquery处理checkbox（复选框）是否被选中

    现在如果一个复选框被选中,是用checked=true,checked="checked"也行 要用prop代替attr会更好,虽然在jQuery1.6之前版本的attr()方法能 ...

  2. jmeter参数化随机取值实现

    jmeter能用来做参数化的组件有几个,但是都没有随机取值的功能,遇到随机取值的需求怎么办呢? 突发奇想,可以用函数__CSVRead()来实现: __CSVRead() CSV file to ge ...

  3. jmeter JDBC Request （查询数据库获取数据库数据） 的使用

    JDBC Request 这个Sampler可以向数据库发送一个jdbc请求(sql语句),并获取返回的数据库数据进行操作.它经常需要和JDBC Connection Configuration配置原 ...

  4. package(1):tm

    tm包是R语言中为文本挖掘提供综合性处理的package,进行操作前载入tm包,vignette命令可以让你得到相关的文档说明.使用默认安装的R平台是不带tm  package的,在安装的过程中,它会 ...

  5. Tensorflow学习笔记---0--TensorBoard

    运行mnist_with_summaries学习TensorBoard时,由于需要GPU支持,运行窗口报错:Couldn't open CUDA library cupti64_80.dll 解决办法 ...

  6. iOS关于JSONKit解析Unicode字符内容出错，问题出在\u0000

    JSONKit虽然很强大,但是一些特殊的Unicode,比如\u0000是无法解析的. 在github上作者解释了这个问题,说这个是内容提供的错误,不符合标准的内容,所以他不认为这个是自己的错误,这个 ...

  7. 读书笔记 effective c++ Item 49 理解new-handler的行为

    1. new-handler介绍 当操作符new不能满足内存分配请求的时候,它就会抛出异常.很久之前,它会返回一个null指针,一些旧的编译器仍然会这么做.你仍然会看到这种旧行为,但是我会把关于它的讨 ...

  8. 【TED】如何掌握你的自由时间

    [TED]如何掌握你的自由时间 生活 某天翻阅自己原来记录的有道云笔记,发现自己在学校的时候,要求自己每周看三个TED视频,并写一些看后的总结,随意翻阅了下,就发现当时做的好的一些笔记,现在一看就能想 ...

  9. 除去ubuntu的grub引导

    除去ubuntu的grub引导 step如下>> 进入ubuntu终端 sudo gedit /etc/defauli/grub 将 #GRUB_HIDDEN_TIMEOUT=0 最前面的 ...

  10. MSMQ队列学习记录

    微软消息队列-MicroSoft Message Queue(MSMQ) 使用感受:简单. 一.windows安装MSMQ服务 控制面板->控制面板->所有控制面板项->程序和功能- ...