清浮动
父级添加类别!

.clearfix{zoom:1;//兼容ie6,7}
.clearfix:after{
content:".";
display: "block";
height: "0";
clear: both;
visibility: hidden;
}

防止上下margin重叠,也可以清除浮动塌陷(推荐

.clearfix:after,
.clearfix:before{
content:" ";
display: table;
}
.clearfix:after{clear: both;}
.clear{ clear:both;}

  

清浮动,防止上下margin重叠(浏览器顶部空白崩溃)的更多相关文章

  1. CSS清浮动

    × 目录 [1]定义 [2]方法 [3]兼容 前面的话 人们经常谈起清浮动,其实就是解决浮动元素的包含块高度塌陷的问题 定义 clear 清除 值: left | right | both | non ...

  2. IE浏览器清浮动

    .cfx:after,.cfx:before{content:" ";display:table;}.cfx:after{clear:both;}.cfx{*zoom:1;} 今天 ...

  3. CSS清浮动处理(Clear与BFC)

    在CSS布局中float属性经常会被用到,但使用float属性后会使其在普通流中脱离父容器,让人很苦恼 1 浮动带来布局的便利,却也带来了新问题 <!doctype html> <h ...

  4. 【深入BFC】 关于CSS中float布局,清除浮动,和margin合并的原理解析,解开你心中的那些困惑!

    BFC的通俗理解: Block Formatting Context(块级格式化上下文)是W3C CSS 2.1 规范中的一个概念,它决定了元素如何对其内容进行定位,以及与其他元素的关系和相互作用. ...

  5. day44--浮动和清浮动基本小结

    浮动和清浮动 一:浮动 浮动元素会生成一个块级框,而不论它本身是何种元素. 关于浮动的两个特点: 浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止. 由于浮动框不在文档的普 ...

  6. css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响?一起来$('.float')

    一.抛一块问题砖(display: block)先看现象: 分析HTML代码结构: <div class="outer">     <div class=&quo ...

  7. 上下margin重叠传递问题

    我发现强迫症真的是我一个大病...每次都非得把所有情况都实验出来不可...BUT!!!!!!!!!悲催的是,这么多情况我根本记不住...还是要在写代码的时候不断出错再排错~受不了自己了!不过还是把这部 ...

  8. css margin重叠

    父子元素margin(垂直方向)重叠 解决办法: 给子元素添加浮动属性,相应父元素添加必要的清浮动属性: 给父元素添加边缘属性,如padding.border: 同级元素margin(垂直方向)反向重 ...

  9. 【转】css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响?

    摘要: css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响?     一.抛一块问题砖(display: block)先看现象: 分析HTML代码结构: <div class ...

随机推荐

  1. Controller 的 Action 只接受 Ajax 请求

    ASP.NET MVC 使 Controller 的 Action 只接受 Ajax 请求. 2014-08-27 14:19 by h82258652, 555 阅读, 2 评论, 收藏, 编辑 首 ...

  2. QTP DataTable全攻略(1)

    上一篇 / 下一篇  2009-07-27 00:14:16 / 个人分类:qtp 查看( 575 ) / 评论( 0 ) / 评分( 0 / 0 ) 下面的代码可能有点乱,基本涉及到常用的datat ...

  3. wp7学习笔记

    1.xap:最终是压缩包:最终部署有系统控制,防止流亡软件:放到固有位置productid;有的文件放在.dll中或直接放入目录下:控制有生成操作:content,内容,content效率更高不用从. ...

  4. hdu 1239 Calling Extraterrestrial Intelligence Again (暴力枚举)

    Calling Extraterrestrial Intelligence Again Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: ...

  5. 浅谈DevExpress<三>:在GridView中加载动态图片

    今天的演示效果如下:在GridView中的下拉框中选中一种颜色,则后面的加载相应的图片,如下图: 1.

  6. mac 下安装oh my zsh

    1.直接从github上下载 git clone git://github.com/robbyrussell/oh-my-zsh.git ~/.oh-my-zsh  2.拷贝到账户目录下 cp ~/. ...

  7. Task.WhileAll扩展方法

    TPL实现Task.WhileAll扩展方法 文章翻译整理自 Nikola Malovic 两篇博文: Task.WhileAll Awaitable task progress reporting ...

  8. CSS3/jQuery自定义弹出窗口

    简单演示一下,精简了演示效果和css样式文件,更利于在项目中的实际应用 引入style.css   index.js <!DOCTYPE HTML PUBLIC "-//W3C//DT ...

  9. 进程间通讯之mmap文件共享

    进程间通讯之mmap文件共享 引文: 个人名言:“同一条河里淹死两次的人,是傻子,淹死三次及三次以上的人是超人”.经历过上次悲催的面试,决定沉下心来,好好的补充一下基础知识点.本文是这一系列第一篇:进 ...

  10. ngx-push-stream模块源码学习(一)——序言

    一.概述     与传统的request-response的web应用模式不同,comet是一种长连接(long-held)的应用模式,从而允许服务端主动向客户端推送数据.     主流的comet技 ...