推荐几种好用的清除浮动方法:

方法1:

    .clearfix:after {
content:".";
display:block;
height:;
clear:both;
visibility:hidden;
}
.clearfix{*+height:1%;}

方法2:

    .clearfix:after {
content:"\200B";
display:block;
height:;
clear:both;
}
.clearfix {*zoom:;}/*IE/7/6 */
/* content:"\200B";这个参数,Unicode字符里有一个“零宽度空格”,即 U+200B,代替原来的“.”,可以缩减代码量。而且不再使用visibility:hidden。 */

方法3:

    .clearfix {
overflow:auto;
_height:1%;
}

方法4:

    .clearfix {
overflow:hidden;
_zoom:;
}

css清除浮动的几种方法的更多相关文章

  1. [Web 前端] 018 css 清除浮动的四种方法

    清除浮动的四种方法 加 clear: ...(见例1) 父级上增加属性 overflow:hidden(见例2.1) 在最后一个子元素的后面加一个空的 div,给它一个样式属性 clear: both ...

  2. 活学活用,CSS清除浮动的4种方法

    清除浮动这个问题,做前端的应该再熟悉不过了,咱是个新人,所以还是记个笔记,做个积累,努力学习向大神靠近. CSS清除浮动的方法网上一搜,大概有N多种,用过几种,说下个人感受. 1.结尾处加空div标签 ...

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

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

  4. css清除浮动的8种方法以及优缺点

    浮动会使当前标签产生上浮的效果,同时会影响到前后的标签.父级标签的位置及width height 属性.而且同样的代码,在各种浏览器中效果可能不同,这样让清除浮动更难了.清除浮动引起的问题有很多的方法 ...

  5. CSS 清除浮动的4种方法

    此为未清除浮动源代码,运行代码无法查看到父级元素浅黄色背景.<style type=”text/css”> <!– *{margin:0;padding:0;} body{font: ...

  6. CSS 清除浮动的几种方法

    导读: CSS 的 Float(浮动),会使元素向左或向右移动,其周围的元素也会重新排列,Float(浮动),往往是用于图像,使得文字围绕图片的效果,而它在布局时一样非常有用.不过有利也有弊,使用浮动 ...

  7. CSS 清除浮动的四种方法

    在实际项目中,我们经常会用到float属性来对页面进行布局.当使用float时,意味着该元素已经脱离了文档流,相当于浮于文档之上,不占据空间.但是针对兄弟元素为文字内容时,会占据一定空间,从而产生文字 ...

  8. CSS读书笔记(3)---清除浮动的几种方法

    浮动元素容易造成页面错位现象.下面说说关于清除浮动的几种方法. 首先.先创建一个浮动导致错位的页面. <!DOCTYPE html> <html lang="en" ...

  9. [css]浮动-清除浮动的3种方法

    清除浮动的方法: 内墙法 注: 这是个奇淫技巧,没什么原理可言,记住即可 这个技巧又使得父box重新可以被子box撑开高度了. 隔墙法-适用于2个box之间上下排列 由于2个box高度依旧是0, 彼此 ...

随机推荐

  1. org.springframework.context.ApplicationContextException: Unable to start web server; nested exception is org.springframework.context.ApplicationContextException: Unable to start ServletWebServerApplic

    org.springframework.context.ApplicationContextException: Unable to start web server; nested exceptio ...

  2. 【TJOI/HEOI2016】求和

    题面 题目分析 \[ \begin{split} \sum_{i=0}^n\sum_{j=0}^iS(i,j)\cdot 2^j\cdot j!&=\sum_{j=0}^n2^j\cdot j ...

  3. 1.隐藏继承的成员new / 虚方法(override)/ abstract / 多态 ----- 重写

    总结: 1. 在继承上, new/override没区别 2. 在多态上,new不支持多态,override支持 在C#中改变类中相同名称的方法的实现过程中有三种方式:重载.重写和覆盖. 重载:指具有 ...

  4. Mina---系统学习

    1.为何使用Mina? java提供的BIO.NIO使用的复杂性等原因,导致Mina框架的诞生: 2.什么时候使用Mina? 易于使用 高并发的用户量 被证明的系统: Mina已被全球数以万计的应用使 ...

  5. python3 投票

    import urllib.request # cd C:\Python36-32\Scripts # pip install BeautifulSoup from bs4 import Beauti ...

  6. sql 性能优化 索引碎片

    1.索引 简单的说,索引就像书本的目录,目录可以快速找到所在页数,数据库中索引可以帮助快速找到数据,而不用全表扫描,合适的索引可以大大提高数据库查询的效率.(1). 优点大大加快了数据库检索的速度,包 ...

  7. Amazon Linux AMI 2015.09 (HVM)平台搭建lamp

    更新yum yum update 安装Apache: yum install -y httpd 安装完之后,重新启动 service httpd restart 将Apache设置为开机启动 chkc ...

  8. 互联网大厂高频重点面试题 (第2季)JUC多线程及高并发

    本期内容包括 JUC多线程并发.JVM和GC等目前大厂笔试中会考.面试中会问.工作中会用的高频难点知识.斩offer.拿高薪.跳槽神器,对标阿里P6的<尚硅谷_互联网大厂高频重点面试题(第2季) ...

  9. 设置单网卡双ip

    环境如下: [root@localhost ~]# cat /etc/redhat-releaseCentOS Linux release 7.7.1908 (Core) 安装时选择的最小化安装 -- ...

  10. Keepalived 双主虚拟路由配置实例

    Keepalived 双主虚拟路由配置实例 演示前说明: 2台centos7.2 主机:node-00,node-01 VIP1:10.1.38.19预定node-00占有 VIP2:10.1.38. ...