<!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. HTML5离线存储和本地缓存

    一.离线存储 有一个web应用有三个文件index.html,a.js,b.css,现在需要把js和css文件缓存起来 1.在index.html里加上<html manifest=" ...

  2. Advanced GET 9.1 修正汉化版（免注册、页面加载、保存都正常）

    http://www.55188.com/viewthread.php?tid=2846679 Advanced GET 9.1 修正汉化版(免注册.页面加载.保存都正常) 网上流传的很多GET9.1 ...

  3. Shiro：学习笔记(2)——授权

    Shiro:学习笔记(2)——授权 Shiro的三种授权方式 编程式: Subject subject = SecurityUtils.getSubject(); if(subject.hasRole ...

  4. Android Theme主题

    •android:theme="@android:style/Theme.Dialog" 将一个Activity显示为能话框模式 •android:theme="@and ...

  5. 【Flask】Sqlalchemy 增删该查操作

    ### sqlalchemy 增删改查操作, 通过session来进行操作. # coding:utf-8 # Author: liangjun. from sqlalchemy import cre ...

  6. jQuery宽屏游戏焦点图

    在线演示 本地下载

  7. vim 操作符命令和位移(如删除和修改)

    一.字符删除命令:x,d,D x 删除光标下的字符,前面可以加入命令计数,如:5x 代表删除从当前光标到后面的5个字符,包括空格: X 删除光标前面的一个字符: dw 删除光标下到word后的数据: ...

  8. sdut oj 操作系统实验--SSTF磁盘调度算法【操作系统算法】

    操作系统实验--SSTF磁盘调度算法 Time Limit: 1000ms   Memory limit: 65536K  有疑问?点这里^_^ 题目描述 磁盘调度在多道程序设计的计算机系统中,各个进 ...

  9. 总结最近写的h5项目

    其实最近最大的感触就是真正独立完结一个项目的人学到的东西是最多,但并不意味着自己已全部吸收,还是得消化消化 最近做了一个移动端的h5页面,感兴趣的可以访问看一看:http://app.500jia.c ...

  10. HTML5 Video Blob

    我的博客搬家到https://www.w2le.com/了 <video src="blob:http://www.bilibili.com/d0823f0f-2b2a-4fd6-a9 ...