html body div.clear,
html body span.clear
{
background: none;
border: 0;
clear: both;
display: block;
float: none;
font-size: 0;
margin: 0;
padding: 0;
overflow: hidden;
visibility: hidden;
width: 0;
height: 0;
}

 

还有一种是

.clearfix:after {
content: "020";
display: block;
height: 0;
clear: both;
}
.clearfix {
zoom: 1;
}

这个是优化版的清除浮动的样式,很值得推荐。

使用方法:通过在页面中添加<div class=”clear”></div> 或 <span class=”clear”> </span>来清除页面中的浮动。

.clear 万能清除浮动的更多相关文章

  1. 关于clear与清除浮动

    今天看bootstrap突然看到了 .container:after { clear: both; } 好像对clear的用法有点模糊,于是于是又研究一下用法. 上面搜资料总会搜到张鑫旭老师的相关文章 ...

  2. [转]CSS clear both清除浮动

    DIV+CSS clear both清除产生浮动 我们知道有时使用了css float浮动会产生css浮动,这个时候就需要清理清除浮动,我们就用clear样式属性即可实现. 接下来我们来认识与学习cs ...

  3. CSS clear both清除浮动总结

    我们知道有时候使用了CSS float浮动,会产生CSS浮动,这个时候就需要清理浮动,我们就用clear样式属性即可实现. 接下来我们来认识与学习CSS clear知识与用法. clear清除浮动目录 ...

  4. CSS clear both清除浮动

    .clear{clear:both;} <div class="clear"></div>

  5. BFC之清除浮动篇&clear

    我们在日常代码生活中,或多或少会利用浮动来布局,例如导航布局,如下图所示: 但是,我们在实现的时候,经常会遇到父元素“塌陷”以及清除浮动问题.例如 <!DOCTYPE html> < ...

  6. 【css】清除浮动(clearfix 和 clear)的用法

    本文主要是讲解如何在 html 中使用 clearfix 和 clear,针对那些刚开始了解 css 的童鞋.关于 clearfix 和 clear 的样式在这里我就不写了,具体样式点击此处. 下面就 ...

  7. CSS清除浮动_清除float浮——详解overflow:hidden 与clear:both属性

    最近刚好碰到这个问题,看完这个就明白了.写的很好,所以转载了! CSS清除浮动_清除float浮动 CSS清除浮动方法集合 一.浮动产生原因   -   TOP 一般浮动是什么情况呢?一般是一个盒子里 ...

  8. 清除浮动(overflow、clear、:after等方法)

    元素在浮动之后有三个重要的特点: 脱离文档流. 向左/向右浮动直到遇到父元素或者别的浮动元素. 浮动会导致父元素高度坍塌.  解决父元素高度坍塌的方式就是清除浮动. 以下述代码为例: <styl ...

  9. css清除浮动的几种方法整理

    四种清除浮动方法如下: 1.使用空标签清除浮动.空标签可以是div标签,也可以是P 标签.这种方式是在需要清除浮动的父级元素内部的所有浮动元素后添加这样一个标签 清除浮动,并为其定义CSS代码:cle ...

随机推荐

  1. CMPP3.0实现物联网卡通讯

    当下物联网发展迅猛,物联网卡可以接受短信指令,实现千里之外尽可掌控.本人做过一个这类项目,把相关经验记录下来,分享给需要的人. 物联网卡通讯其实跟电话卡一样,可以使用CMPP协议.不过由于物联网卡位数 ...

  2. 【转发】揭秘Facebook 的系统架构

    揭底Facebook 的系统架构 www.MyException.Cn   发布于:2012-08-28 12:37:01   浏览:0次 0 揭秘Facebook 的系统架构 www.MyExcep ...

  3. ORA-12154 & TNS-03505 案例分享

    下面介绍一个工作中遇到的案例场景,应用服务器连接数据库出现"ORA-12154: TNS: 无法解析指定的连接标识符".一般情况下ORA-12541错误是很容易排除的,但是这次遇到 ...

  4. asp.net mvc jQuery 城市二级联动

    页面效果图: 数据库表结构: 首先在数据库中创建省级.城市的表,我的表如下:我用了一张表放下了省级.城市的数据,用level划分省份和城市,parentId表示该城市所在省份的id 主要文件有:ind ...

  5. Linux 性能优化工具 perf top

    1. perf perf 是一个调查 Linux 中各种性能问题的有力工具. NAME perf - Performance analysis tools for Linux SYNOPSIS per ...

  6. Nginx 切片模块、断点续传

    熟悉 CDN 行业主流技术的朋友应该都比较清楚,虽然 Nginx 近几年发展的如日中天,但是基本上没有直接使用它自带的 proxy_cache 模块来做缓存的,原因有很多,例如下面几个: 不支持多盘 ...

  7. React Native初试:Windows下Andriod环境搭建

    最近想写个App,又觉得Native App 太无趣了Web App又没那么成熟然后发现了Facebook在9月发布的React Native比较新奇,所以决定捣鼓看看: React Native为F ...

  8. Linux磁盘管理之创建磁盘分区05

    一.磁盘基础知识 磁盘安装在计算机上后,在系统读取到硬盘后并不能直接使用,必须经过分区.格式化才能够正确使用.这一次主要是针对磁盘分区进行简单总结,存储设备类型:U盘.光盘.软盘.硬盘.磁带. 硬盘接 ...

  9. [转] cordova-plugin-x-toast

    本文转自:https://www.npmjs.com/package/cordova-plugin-x-toast cordova plugin add https://github.com/Eddy ...

  10. Android蓝牙实例(和单片机蓝牙模块通信)

    最近做毕设,需要写一个简单的蓝牙APP进行交互,在网上也找了很多资料,终于给搞定了,这里分享一下^_^. 1.Android蓝牙编程 蓝牙3.0及以下版本编程需要使用UUID,UUID是通用唯一识别码 ...