用after伪类实现，兼容多种浏览器：
.clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden;overflow:hidden;}

为了兼容IE6、IE7，加上下面代码：

.clearfix{zoom:1}

一般情况下，如果父层内部有浮动(float)可能导致父层的高度为0，加上clearfix后就行了。

使用after伪类，配合IE的zoom或者overflow清除浮动的更多相关文章

  1. ::before ::after CSS3中的伪类和伪元素

    ::before和::after伪元素的用法 一.介绍 css3为了区分伪类和伪元素,伪元素采用双冒号写法. 常见伪类——:hover,:link,:active,:target,:not(),:fo ...

  2. CSS的伪类 :before 和 :after

    CSS 有两个说不上常用的伪类 :before 和 :after,偶尔会被人用来添加些自定义格式什么的,但是它们的功用不仅于此.前几天发现了 Creative Link Effects 这个非常有意思 ...

  3. 【转载】CSS 伪类-:before和:after

    :before和:after的作用就是在指定的元素内容(而不是元素本身)之前或者之后插入一个包含content属性指定内容的行内元素,最基本的用法如下: #example:before { conte ...

  4. CSS动态伪类选择器温故-3

    动态伪类选择器 伪类选择器:大家熟悉的:[:link][:visited][:hover][:active]CSS3的伪类选择器分为六种:(1)动态伪类选择器(2)目标伪类选择器(3)语言伪类选择器( ...

  5. CSS 属性 :before && :after的用法，伪类和伪元素的区别

    一::before && :after的用法 :before 如同对伪元素的名称一样,:before 是用来给指定的元素的内容前面插入新的内容.举例说明: .before:before ...

  6. css 伪类::after ::beftor 的使用方式

    注释:对于 IE8 及更早版本中的 :before,必须声明 . ::before和::after这两个主要用来给元素的前面或后面插入内容,这两个常用"content"配合使用,见 ...

  7. CSS3 选择器——伪类选择器

    前面花了两节内容分别在<CSS3选择器——基本选择器>和<CSS3选择器——属性选择器>介绍了CSS3选择器中的基本选择器和属性选择器使用方法,今天要和大家一起学习CSS3选择 ...

  8. CSS3选择器（三）之伪类选择器

    伪类选择器对于大家来说最熟悉的莫过于:link,:focus,:hover之类的了,因为这些在平时中是常用到的伪类选择器,那么先和大家一起简单总 结一下CSS中常用的伪类选择器的使用方法,最后把重心放 ...

  9. :before 和 :after 的内幕 以及伪类 ( 转 )

    原文链接    http://www.cnblogs.com/zhujl/archive/2012/05/08/2489411.html ------------------------------- ...

随机推荐

  1. ASP.NET Core [2]:Middleware-请求管道的构成（笔记）

    原文链接:http://www.cnblogs.com/RainingNight/p/middleware-in-asp-net-core.html 中间件处理请求主要分为三个阶段:1. 中间件的注册 ...

  2. Python全栈工程师（包、模块 的导入）

    ParisGabriel                每天坚持手写  一天一篇  决定坚持几年 为了梦想 为了信仰     Python人工智能从入门到精通 $ pip3 install tenso ...

  3. sources-t.list

    deb http://debian.ustc.edu.cn/ubuntu/ trusty main multiverse restricted universe deb http://debian.u ...

  4. php中普通方法和静态方法的区别以及抽象类和接口

    实例化类产生对象.class fenbi{ //普通成员,属于对象 public $length = "10cm"; //静态成员,静态变量,属于类. public static ...

  5. zh-Hans & locales & vs code locale.json

    zh-Hans & locales https://code.visualstudio.com/docs/getstarted/locales https://code.visualstudi ...

  6. 【bzoj2396】神奇的矩阵 随机化

    题目描述 给出三个行数和列数均为N的矩阵A.B.C,判断A*B=C是否成立. 输入 题目可能包含若干组数据.对于每组数据,第一行一个数N,接下来给出三个N*N的矩阵,依次为A.B.C三个矩阵. 输出 ...

  7. 洛谷 P4139 上帝与集合的正确用法 解题报告

    P4139 上帝与集合的正确用法 题目描述 根据一些书上的记载,上帝的一次失败的创世经历是这样的: 第一天, 上帝创造了一个世界的基本元素,称做"元". 第二天, 上帝创造了一个新 ...

  8. Java不需要加载整张图片而获取图片的大小

    转载地址 http://blog.jdk5.com/zh/java-get-image-size-without-loading-the-whole-data/ 利用Java类,获取图片的类型,宽度和 ...

  9. 【ZOJ4061】Magic Multiplication（构造）

    题意:定义一个新运算为两个数A,B上每一位相乘,然后顺次接在一起,现在给定结果C和原来两个数字的长度,要求恢复成原来的数字A,B 若有多解输出A字典序最小的,A相同输出B字典序最小的,无解输出Impo ...

  10. Spring的属性依赖检查

    spring支持4种依赖检查:默认的是none none – No dependency checking. simple – If any properties of primitive type ...