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. 基于IAP和网口升级固件

    基于IAP和网口升级固件 一.      需求引入 现有嵌入式设备:基于ARM Cortex-M3处理器.带以太网通讯功能. 为减少设备维护成本节省宝贵的时间和金钱,须要设计网口升级固件功能. 本文描 ...

  2. JavaScript toString() 方法

    注意:在JavaScript中,数字后面的"."操作符是的意义是不确定.因为它既可能是一个浮点数的标志,又可能是取一个对象的属性的运算符.但是JavaScript的解释器把他当做了 ...

  3. iOS 10 的杂碎资料

    兼容iOS 10 资料整理笔记   1.Notification(通知) 自从Notification被引入之后,苹果就不断的更新优化,但这些更新优化只是小打小闹,直至现在iOS 10开始真正的进行大 ...

  4. mvc 各种返回值

    一个例子胜过千言万语,直接上代码 SpringMVC的Controller控制器返回值详解 SpringMVC Controller 返回值几种类型 Spring MVC 更灵活的控制 json 返回 ...

  5. Java 学习 day06

    01-面向对象(Static关键字) package myFirstCode; /* 静态:static. 用法:是一个修饰符,用于修饰成员(成员变量,成员函数) 当成员被静态修饰后,就多了一个调用方 ...

  6. mac sublime text 3 add ctags plugin

    https://www.smslit.top/2015/11/14/macSTctags-Develop/ ctags插件for sublime text项目和ctags源码项目都在github上.

  7. Git with SVN

    1)GIT是分布式的,SVN不是: 这 是GIT和其它非分布式的版本控制系统,例如SVN,CVS等,最核心的区别.好处是跟其他同事不会有太多的冲突,自己写的代码放在自己电脑上,一段时间后再提交.合并, ...

  8. 【python】python版本升级,从2.6.6升级到2.7.13

    centos6.5系统自带了2.6.6版本的python,有时候为了项目上的需要,需要将python版本升级到2.7.13,下面介绍了如何进行升级. 说明:python从2.6升级到2.7会引发很多问 ...

  9. ubuntu把文件移动到指定的文件夹

    有个文件a.txt在/etc下,想把它移动到/etc/fuck文件夹中 cd /etc/fuck sudo mv a.txt 要移动到的文件夹 没报错就成功了

  10. map select reduce

    map: 针对每个element进行变换并返回整个修改后的map a.map do |item| a.upcase end a.map(&:upcase) 一样的效果, &:代表了it ...