清除浮动

设置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. IntelliJ IDEA ,springboot 2.0 +mybatis 创建和访问数据库

    环境: JDK8+windows10 步骤 New Module —>Spring Initializr—>next 1 ​ 2. ​ 3.web勾选web,sql里面可以不勾,后续添加, ...

  2. Oracle内部latch获取函数简介

      标签: oracle call 函数   oracle statpack   转自: http://blog.51cto.com/458302/998775 Oracle的内部函数一直非常神秘,其 ...

  3. Java使用QRCode.jar生成与解析二维码

    原文V:http://www.cnblogs.com/bigroc/p/7496995.html#3797682 正题:Java使用QRCode.jar生成与解析二维码demo 欢迎新手共勉,大神监督 ...

  4. vue生命周期的栗子

    vue生命周期的栗子注意触发vue的created事件以后,this便指向vue实例,这点很重要 <!DOCTYPE html><html><head><me ...

  5. 赞一下TMS Software 和 AdvStringGrid

    非常久前给Support发Email问能不能在设计期给AdvStringGrid标题加个数字标识.每次我都是自己改代码加上去.这次升级到新版本号,没想到增加了这个功能: 功能虽小可是非常有用,非常多的 ...

  6. Maven引入本地Jar包并打包进War包中

    1.概述 在平时的开发中,有一些Jar包因为种种原因,在Maven的中央仓库中没有收录,所以就要使用本地引入的方式加入进来. 2. 拷贝至项目根目录 项目根目录即pom.xml文件所在的同级目录,可以 ...

  7. Resharper 8.2的“安装”问题

    概述 完美解决Resharper 8.2的“安装”问题和VS2012写Javascript语句无法智能提示的问题: 目录 引言——Resharper 简介——安装——VS2012智能提示测试 引言 最 ...

  8. cocos2dx3.0 对象池

    watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdzE4NzY3MTA0MTgz/font/5a6L5L2T/fontsize/400/fill/I0JBQk ...

  9. Ubuntu16.04下Django项目的部署

    起飞前的准备 # 首先在Ubuntu的当前用户zhang下新建data文件夹,然后在data文件夹下新建你的项目目录root@zhang-virtual-machine:/home/zhang/dat ...

  10. 发送邮件程序报错454 Authentication failed以及POP3和SMTP简介

    一.发现问题 在测试邮件发送程序的时候,发送给自己的QQ邮箱,程序报错454 Authentication failed, please open smtp flag first. 二.解决问题 进入 ...