<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style>

        .clearfix:after{

            content: "111";

            display: block;

            clear: both;

            visibility: hidden;

            height: 0;

        }

        .c{

            background-color: red;

        }

        .c .item{

            float: left;

        }

    </style>

</head>

<body>

    <div class="c clearfix">

        <div class="item">sg</div>

        <div class="item">dsg</div>

    </div>

</body>

</html>

.clearfix:after的更多相关文章

  1. clearfix的最佳方案----在路上（22）

    clearfix的纠结 骨灰级解决办法: .clear{clear:both;height:0;overflow:hidden;} 上诉办法是在需要清除浮动的地方加个div.clear或者br.cle ...

  2. clearfix的应用

    之前遇到一个问题,引用Bootstrap框架时 一行显示四个模块,小屏幕时显示两个模块 当内容一样时,大小屏幕时一样的,但是当其中一个和另一个内容不同时,展示效果就会有错乱 <div class ...

  3. bootstrap之clearfix

    bootstrap之clearfix 在bootstrap辅助类中有那么一类,是这么定义的: 利用clearfix样式清除浮动,但是前提条件是在超小型屏幕上能显示才行(因为其是用visible-xs样 ...

  4. 解读浮动闭合最佳方案：clearfix

    .clear{clear:both;height:0;overflow:hidden;} 上诉办法是在需要清除浮动的地方加个div.clear或者br.clear,我们知道这样能解决基本清浮动问题. ...

  5. clearfix清除浮动

    首先在很多很多年以前我们常用的清除浮动是这样的. 1 .clear{clear:both;line-height:0;} 现在可能还可以在很多老的站点上可以看到这样的代码,相当暴力有效的解决浮动的问题 ...

  6. ie7 用 clearfix 清除浮动时遇到的问题

    <!doctype html> <html> <head> <style> .fr{float:right;display:inline} li{bor ...

  7. css中clearfix清除浮动的用法及其原理示例介绍

    clearfix的定义: .clearfix:after {}{ content: "."; /**//*内容为“.”就是一个英文的句号而已.也可以不写.*/ display: b ...

  8. css用clearfix清除浮动

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

  9. [笔记]使用clearfix清除浮动

    转载自奶牛博客 .clearfix { *zoom: 1; } .clearfix:before, .clearfix:after { display: table; line-height: 0; ...

  10. clearfix清除浮动进化史

    我想大家在写CSS的时候应该都对清除浮动的用法深有体会,今天我们就还讨论下clearfix的进化史吧. clearfix清除浮动 首先在很多很多年以前我们常用的清除浮动是这样的. .clear{cle ...

随机推荐

  1. QT发布的EXE打包压缩成单文件

    Enigma virtual box 是免费的软件虚拟化工具,它可以将多个文件封装到您的应用程序主文件,这样您的软件就可以制作成为单文件的绿色软件. enigma virtual box 支持所有类型 ...

  2. vim复制多行

    比如我要复制从第1行到第5行的数据,复制到第9行 光标移到第5行任意位置,输入ma光标移到第1行任意位置,输入y'a(这一定要打这个“'”单引号,否则就进入“INSERT”状态了光标移到需要复制的行, ...

  3. iOS __weak 和 __block 的使用探讨

    在基本的开发中遇到 需要弱引用时候 我一般 用 weak  预防 死锁的时候 我会用 block 的确没出过大错  但是这样处理 的确有点囫囵  现在我想好好理解一下这两个修饰符 "bloc ...

  4. Python 可变长度函数参数

    func( *tuple_grp_nonkw_args, **dict_grp_kw_args ) 在编程的过程中,我们可能会遇到函数参数个数不固定的情况.这时就需要使用可变长度的函数参数来实现我们的 ...

  5. 《程序员代码面试指南》第三章 二叉树问题 遍历二叉树的神级方法 morris

    题目 遍历二叉树的神级方法 morris java代码 package com.lizhouwei.chapter3; /** * @Description:遍历二叉树的神级方法 morris * @ ...

  6. P2487 [SDOI2011]拦截导弹

    题目 P2487 [SDOI2011]拦截导弹 做\(SDOI\)有种想评黑的感觉,果然还是太弱了 做法 独立写(调)代码三个小时祭 简化题目:求二维最长不上升子序列及每个点出现在最长不上升子序列概率 ...

  7. php使用mysql数据库时中文不显示或显示异常解决方法

    如果出现标题所述问题,需从四个层面解决问题 1 项目文件是否为utf8编码 右键项目文件->properties->Resource->Text file encoding-> ...

  8. SS中的三种样式来源：创作人员、读者和用户代理

    CSS中的样式一共有三种来源:创作人员.读者和用户代理,来源的不同会影响到样式的层叠方式,很多第一次学习CSS的朋友,对这三种来源可能会存在一些困惑,下面我写一下自己的理解,若有错误的地方还请指正. ...

  9. codeforces 466C 计数 codeforces 483B 二分 容斥

    题意:给你n个数,将他们分成连续的三个部分使得每个部分的和相同,求出分法的种数. 思路:用一个数组a[i]记下从第一个点到当前i点的总和.最后一个点是总和为sum的点,只需求出总和为1/3sum的点和 ...

  10. tkinter窗口系列之一——列表框

    以下内容来自https://tkdocs.com/tutorial/morewidgets.html 一个列表框显示由单行文本所组成的一栏条目,通常它很冗长,它允许使用者通过列表浏览其中的内容,选择一 ...