清除浮动

设置overflow的一个更流行的用处是，说也奇怪，清除浮动。设置overflow并不会在该元素上清除浮动，它将清除自己(self-clear)。意思就是，应用了overflow(auto或hidden)的元素，将会扩展到它需要的大小以包围它里面的浮动的子元素(而不是叠了起来(collapsing))，假设未定义高度。就像这样：

对于此问题，经过测试，IE6会自动扩展父层元素的高度，而IE8和FF等浏览器加上overflow:auto后，即可清除浮动。——神飞

file:///D:/dw/overflow_cs.html

CSS Overflow 属性清除浮动的更多相关文章

  1. 转：CSS Overflow 属性

    原文:CSS Overflow 属性译自:The CSS Overflow Property版权所有,转载请注明出处,多谢!! 根据CSS的盒模型概念,页面中的每个元素,都是一个矩形的盒子.这些盒子的 ...

  2. CSS知识点：清除浮动

    开场白 我们平时工作中,很容易遇到浮动效果.一个DIV中嵌套多个DIV,左边显示一个DIV,右边显示一个DIV,外层DIV的高度随着内层内容的高度变化.这就是最基本的浮动效果.下图的百度搜索结果就是一 ...

  3. css用clearfix清除浮动

    本文从http://www.studyofnet.com/news/196.html复制.   本文导读:写css 时总为浮动而烦恼,如果用了浮动,浮动的父层不会跟着浮动框的高度增加而增加,在Fire ...

  4. {前端CSS} 语法 Css的几种引入方式 css选择器 选择器的优先级 CSS属性相关 背景属性 边框 CSS盒子模型 清除浮动 overflow溢出属性　　定位（position）z-index

    前端CSS CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表来对文 ...

  5. CSS 的overflow:hidden (清除浮动)

    verflow:hidden这个CSS样式是大家常用到的CSS样式,但是大多数人对这个样式的理解仅仅局限于隐藏溢出,而对于清除浮动这个含义不是很 了解.一提到清除浮动,我们就会想到另外一个CSS样式: ...

  6. css中：overflow:hidden清除浮动的原理

    要想彻底清除浮动的影响,适合的属性不是 clear 而是 overflow. 一般使用 overflow:hidden,利用 BFC 的“结界”特性彻底解决浮动对外部或兄弟元素的影响. 1. 前言: ...

  7. css技巧：清除浮动

    1.常用方法——overflow 给浮动元素的容器添加overflow:hidden;或overflow:auto;可以清除浮动,另外在 IE6 中还需要触发 hasLayout ,例如为父元素设置容 ...

  8. CSS系列，清除浮动方法总结

    在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素.在这种情况下,容器的高度不能自动伸长以适应内容的高度,使得内容溢出到容器外 ...

  9. ife任务刷题总结（一）－css reset与清除浮动

    本文同时发布于本人的个人网站www.yaoxiaowen.com 百度创办的前端技术学院,是一个面向大学生的前端技术学习平台.虽然只有大学生才有资格报名,提交代码进行比赛排名.但是这并不妨碍我们这些初 ...

随机推荐

  1. awk在企业中最常用的语句

    awk最常用以及面试基本都会被问到的实例: A.统计日志中每个URL被访问的次数 cat access.log http://www.etiantian.org/1.html http://post. ...

  2. (入门SpringBoot)SpringBoot配置全局异常(五)

    Spring的全局异常,用于捕获程序员没有捕获的异常.具体请看下面代码: 1.ControllerAdvice拦截异常,统一处理.通过Spring的AOP来管理. @ControllerAdvicep ...

  3. win7 x64 dtrace

    1.下载WINDOW DTRACE 工具 https://github.com/prash-wghats/DTrace-win32 2.系统参数修改 bcdedit/set testsigning o ...

  4. SharePreferences使用

    获取数据: @SuppressLint("InlinedApi") private String getFromSharePreference(String key) { if ( ...

  5. Leetcode 232 Implement Queue using Stacks 和 231 Power of Two

    1. 232 Implement Queue using Stacks 1.1 问题描写叙述 使用栈模拟实现队列.模拟实现例如以下操作: push(x). 将元素x放入队尾. pop(). 移除队首元 ...

  6. Zen of Python(Python的19条哲学)

    The Zen of Python Beautiful is better than ugly. Explicit is better than implicit. Simple is better ...

  7. Spring MVC传值乱码解决

    在web.xml中进行配置,加入以下代码: <!-- 乱码解决 --> <filter> <filter-name>characterEncodingFilter& ...

  8. logstash+es+kibana+redis搭建

    环境信息: CentOS 6.5 redis 3.0.4 logstash elasticsearch kibana 服务端ip:192.168.0.65 客户端ip:192.168.0.66 关系结 ...

  9. Legacy BIOS Boot 是如何启动或引导的

    现在Windows 8 64位操作系统全面采用UEFI引导启动的方式,与过去的Legacy启动有什么区别呢?今天就让我们一起来了解下. Legacy BIOS UEFI Boot 是如何启动或引导的 ...

  10. C# 比较两个数组中的内容是否相同的算法

    这里要比较的是两个数组中的内容是否相同,以int数组为例 int[] Arraya=new[] {1,2,3,4,5} int[] Arrayb=new[] {5,3,2,1,4} 以上两个数组内的值 ...