用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. 条件随机场(Conditional random field)

    条件随机场真是把我给折磨坏了啊,本以为一本小小的<统计学习方法>攻坚剩下最后一章,心情还是十分愉悦的,打算一口气把它看完,结果真正啃起来真是无比的艰难啊,每一句对我都好像是天书一般,怎么这 ...

  2. poj 1035 纯正的字符串水

    Spell checker Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 22673   Accepted: 8258 De ...

  3. SQL查询oracle的nclob字段

    使用CONTAINS关键字查询NCLOB字段 SELECT  FORMATTED_MESSAGE    FROM     TBL_LOG WHERE     CONTAINS(FORMATTED_ME ...

  4. [codeforces] 498D Traffic Jams in th Land

    原题 简单的线段树问题. 对于题目中,a[i]的范围是2~6,我们仔细思考可以得出第0秒和第60秒是一样的(因为2~6的最小公倍数是60,),然后我们可以建一个线段树,里面记录0~59秒时刻开始通过这 ...

  5. Uva10635 Prince and Princess

    题目戳这里 这题如果用\(f_{i,j}\)这样dp的话肯定过不了,必须另辟蹊径.题目说了数字不重复.我们先只留下两个数组共有的数字.然后我们处理出这样一个数组\(S\),\(S_i\)表示\(A_i ...

  6. Android自复制传播APP原理学习(翻译)

     Android自复制传播APP原理学习(翻译) 1 背景介绍 论文链接:http://arxiv.org/abs/1511.00444 项目地址:https://github.com/Tribler ...

  7. git项目初始化的问题汇总

    转:https://blog.csdn.net/Free_Wind22/article/details/81628721 1.在Git官网上点击New repository新建项目: 2.在本地新建一 ...

  8. Java基础复习--java.util.Timer定时任务

    在java中,Timer类主要用于定时性.周期性任务 的触发,这个类中有两个方法比较难理解,那就是schedule和scheduleAtFixedRate方法,在这里就用实例分析一下. (1)sche ...

  9. 汕头市队赛SRM15

    T1——czl SRM 15 众所周知,czl家养了一只可♂爱的***(已屏蔽),那只东西很贪吃,所以czl家很多零食仓库,然而这些仓库里有很多老鼠. 为了心爱的***,czl决定点燃纯艾条,用烟熏老 ...

  10. 2018多校第三场 hdu6331 M :Walking Plan

    题目链接 hdu6331 自我吐槽,这场多校大失败,开局签到因输入输出格式写错,wa了3发.队友C题wa了1个小时,还硬说自己写的没错,结果我随便造了个小数据,他都没跑对.然后跑对了后又进入了无限的卡 ...