将清除浮动代码添加到重置样式表中,随时可以调用

 .clearfix{margin-right:auto;margin-left:auto;*zoom:}.clearfix:before,.clearfix:after{display:table;content:"";line-height:}.clearfix:after{clear:both}

给需要清除浮动影响的元素添加class名 --- clearfix 例:

 <!-- css -->
<style>
.top {
width: 100%;
height: 200px;
background-color: yellow;
}
.middle .content {
float: left;
margin-top: 20px;
width: 100px;
height: 400px;
background-color: blue;
}
.clearfix {margin-right:auto;margin-left:auto;*zoom:}
.clearfix:before,.clearfix:after {display:table;content:"";line-height:}
.clearfix:after{clear:both}
</style>
 <!-- html -->
<body>
<div class="top"></div>
<div class="middle clearfix">
<div class="content"></div>
</div>
</body>

css清除浮动影响的更多相关文章

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

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

  2. css清除浮动大全共8种方法

    原文链接http://www.jb51.net/css/173023.html 清除浮动是每一个 web前台设计师必须掌握的机能.css清除浮动大全,共8种方法. 浮动会使当前标签产生向上浮的效果,同 ...

  3. CSS清除浮动八种方法

    在各种浏览器中显示效果也有可能不相同,这样让清除浮动更难了,下面总结8种清除浮动的方法,测试已通过 ie chrome firefox opera,需要的朋友可以参考下 清除浮动是每一个 web前台设 ...

  4. css清除浮动的方法汇总

    这是在其他地方看到的一篇文章,汇总的不错,摘过来做个记录. 引用地址 : http://www.cnblogs.com/ForEvErNoME/p/3383539.html ------------- ...

  5. css清除浮动定位造成的异常

    清除浮动是为了解决高度塌陷的问题:内层有好几个div有宽有高,并且选择了浮动定位,但是外层的div却并没有设置宽高.在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动( ...

  6. 什么是CSS清除浮动?

    在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素,在这种情况下,容器的高度不能自动伸长以适应内容的高度,使得内容溢出到容器外 ...

  7. CSS清除浮动各种方法

    当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素,在这种情况下,容器的高度不能自动伸长以适应内容的高度,使得内容溢出到容器外面而影响(甚至破坏)布局的现象.这个现 ...

  8. css清除浮动的八大方法

    清除浮动是每一个 web前台设计师必须掌握的机能.css清除浮动大全,共8种方法. 浮动会使当前标签产生向上浮的效果,同时会影响到前后标签.父级标签的位置及 width height 属性.而且同样的 ...

  9. css清除浮动float方法

    转载:http://www.cnblogs.com/ForEvErNoME/p/3383539.html 什么是CSS清除浮动? 在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的 ...

随机推荐

  1. Linux统计目录下文件个数及代码行数

    1. 统计当前目录下,php文件数量 find ./ -name "*.php" | wc -l 2. 统计当前目录下所有php文件代码行数 find ./ -name " ...

  2. LISTAGG函数

    官网进入 该函数作用是可以实现对列值得拼接: 根据官网介绍,可以对列值排序进行拼接,也可以分组拼接 1.1运行结果 1.2运行结果 2运行结果 注意该函数提供的 over( partition by ...

  3. C++走向远洋——35(友元,时间)

    */ * Copyright (c) 2016,烟台大学计算机与控制工程学院 * All rights reserved. * 文件名:time.cpp * 作者:常轩 * 微信公众号:Worldhe ...

  4. 【Git】按照git提交ID导出修改的代码

    #!/bin/bash IFS=$'\n' #conf start commid id startCommitId=030cd2bf4e3694fe3a3b6f069556c4ea91a9858d l ...

  5. C#中使用 正则表达式 替换img中src路径但保留图片名

    text = Regex.Replace(text, @"(?i)(?<=<img\b[^>]*?src=\s*(['""]?))([^'"& ...

  6. 1,Java知识储备

    1,关于 . java文件 规定:第一行为 package name; 表示该.java文件属于哪一个包. 一个.java文件中可以有多个类,但是只能有一个public类,并且这个public类必须与 ...

  7. sql04

    1.类型转换 ),ClassId)+name from [user]; 2.一次性插入多条数据 3.日期函数 1)getdate() 返回当前日期 2)dateadd 计算增加后的时间 ,'2020- ...

  8. UICollectionViewCell设置阴影

    //@mg:masksToBounds必须为NO否者阴影没有效果 // cell.layer.masksToBounds = NO; cell.layer.contentsScale = [UIScr ...

  9. TCP报文首部

    源端口和目的端口,各占2个字节,每个TCP报文段都包含源端口号和目的端口号,用于寻找发送端和接收端的应用进程: 序号,占4个字节,序号用来标识从TCP发送端向TCP接收端发送的数据字节流,它表示在这个 ...

  10. Git的使用流程及常用命令汇总

    Git是一个很好用的版本控制系统,本文对于常用的一些命令进行了汇总. 创建一个存储仓库(repository) https://github.com/右上角点击"+"号,New r ...