zoom 是个困惑了好久的元素,今天对它有了个初步的认识

  zoom , ie 的专属属性,在其他浏览器中不起作用,它的原本功能是设置或检测对象的缩放比例(只在ie下起作用)
比如  
<div style="background:#f0f3f9; padding:20px; zoom:2;">
<img data-src="http://XXXXX.jpg" border="0" />
</div>

在ie中它会使图片放大两倍显示。

在我们日常见到这个玩意的时候他一般用于浮动的清除,老的说法是可以触发ie的haslayout 来清除浮动

在 非ie 和 ie7及其以上版本的浏览器中,可以使用 overflow :hidden 等方法来进行清除浮动
可是在ie6 及其以下的浏览器中并不能正确的理解 overflow 这个属性,这是早期ie的一个bug
所以我们就可以用以下方式来清除浮动:
<div style="zoom:1; background:#f0f3f9; padding:20px;">
<img style="float:left;" data-src="http://XXXXX.jpg" />
</div>

在ie6 及其以下的浏览器中,div 便有了高度, 此时再给它加上 其他浏览器和ie8+的清除浮动的方法 就可以完美结局  :)

zoom在清除浮动中的利用的更多相关文章

  1. .clearfix:after(清除浮动)中各个属性及值详细解说

    清除浮动.clearfix:after一词,从事web前端的朋友们对此不会陌生吧,下面为大家介绍的是.clearfix:after中用到的所有属性及值的含义,对此感兴趣的朋友可以参考下哈想,希望对大家 ...

  2. 【转】CSS中的浮动和清除浮动

    以下转自<CSS中的浮动和清除浮动,梳理一下!> 浮动到底是什么? 浮动核心就一句话:浮动元素会脱离文档流并向左/向右浮动,直到碰到父元素或者另一个浮动元素.请默念3次! 浮动最初设计的目 ...

  3. CSS(一)解析浮动塌陷与清除浮动

    清除浮动方法 1.对父级设置适合CSS高度,父级元素撑开并且包含子元素. <p>固定高度</p> <div style="height: 50px;" ...

  4. css 浮动布局,清除浮动

    浮动的特性: (1)浮动元素有左浮动(float:left)和右浮动(float:right)两种 (2)浮动的元素会向左或向右浮动,碰到父元素边界.其他元素才停下来 (3)相邻浮动的块元素可以并在一 ...

  5. css浮动产生和清除浮动的几种方式

    浮动的语法:float:left/right; 浮动float的原本设计了作用初衷是为了实现文字环绕效果 浮动产生负作用: 1.背景不能显示 2.边框不能撑开父元素 3.margin padding设 ...

  6. CSS中清除浮动的两种方式

    在CSS中,父元素中的子元素如果使用了float,会导致父元素塌陷,高度为0. 对于这种情况,常见的解决方式有两种. 一.增加新的div,应用clear:both属性 html: <div cl ...

  7. 浅谈css中浮动和清除浮动带来的影响

    有很多时候,我们都会用到浮动,而我们有时候对浮动只是一知半解,却不是太清楚它到底是怎么回事,不知道各位有没有和我一样的感觉,只知道用它,却不知道它到底是怎么回事,所以,在学习的过程中,就要把一个概念不 ...

  8. 详细解读css中的浮动以及清除浮动的方法

    对于前端初学者来说,css浮动部分的知识是一块比较难以理解的部分,下面我将把我学习过程中的心得分享给大家. 导读:   1.css块级元素讲解 2.css中浮动是如何产生的 3.出现浮动后,如何清除浮 ...

  9. css中的浮动与三种清除浮动的方法

    说到浮动之前,先说一下CSS中margin属性的两种特殊现象 1, 外边距的合并现象: 如果两个div上下排序,给上面一个div设置margin-bottom,给下面一个div设置margin-top ...

随机推荐

  1. 在4x4的棋盘上摆满了黑白棋子,黑白两色的位置和数目随机其中左上角坐标为(1,1),右下角坐标为(4,4),现在依次有一些翻转操作,要对一些给定支点坐标为中心的上下左右四个棋子的颜色进行翻转,请计算出翻转后的棋盘颜色。

    // ConsoleApplication10.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include <iostream& ...

  2. 讲真,你是因为什么才买华为P20系列手机!

    华为P20系列手机上市两个半月发货600万台!600万台?!看到这个亮瞎我钛合金狗眼的数据,且容我掰着手指脚趾算一下,算了,还是容我毫不夸张的感叹一句吧:华为做手机不用桨,不需风,全靠“浪”……. 两 ...

  3. Python学习笔记18:标准库之多进程(multiprocessing包)

    我们能够使用subprocess包来创建子进程.但这个包有两个非常大的局限性: 1) 我们总是让subprocess执行外部的程序,而不是执行一个Python脚本内部编写的函数. 2) 进程间仅仅通过 ...

  4. python 基础 3.1 打开文件 a a+ r+ w+ 详解

      一.python 访问文件   1.在python中要访问文件,首先要打开文件,也就是open ---open   r:  只读   w:  只写 ,文件已存在则清空,不存在则创建   a:追加 ...

  5. 公网yum 源地址

    1. centos5.*  公网yum 源地址 [root@web ~]# cd /etc/yum.repos.d/[root@web yum.repos.d]# wget -O /etc/yum.r ...

  6. Python 深入剖析SocketServer模块(二)(V2.7.11)

    五.Mix-In混合类 昨天介绍了BaseServer和BaseRequestHandler两个基类,它们只用与派生,所以贴了它们派生的子类代码. 今天介绍两个混合类,ForkingMix-In 和 ...

  7. EasyNVR流媒体服务器接入EasyDSS云视频平台快照上传实现

    EasyNVR拥有接入EasyDSS云平台的功能 接入EasyDSS云平台会定时向云平台上传快照数据,这个快照数据用于云平台向客户端提供快照展示 遇到的问题 由于快照上传的间隔提供认为修改的功能,则我 ...

  8. Flask:程序结构

    在Flask中需要配置各种各样的参数.比如设置秘钥,比如上一章介绍到的配置数据库类型. app.config['SECRET_KEY']=os.urandom(20) app.config['SQLA ...

  9. redis安装包下载

    redis linux版安装包下载地址 http://download.redis.io/releases/

  10. 在Linux下创建7种类型的文件

    在测试的时候有时会需要每种类型的文件,在系统中进行搜索都会找到,当然最方便的还是手动创建它们进行测试使用. 普通文件: $ touch regular 目录: $ mkdir directory 符号 ...