文档章节

Zoom属性

mxPickle
 mxPickle
发布于 2017/09/05 17:04
字数 455
阅读 7
收藏 0

zoom:1确实帮我们解决了不少ie下的bug,但对于它的来龙去脉,又有多少人知道呢?

语法:

zoom:normal | <number> | <percentage>

默认值:normal

适用于:所有元素

继承性:有

取值:

normal:使用对象的实际尺寸。

<number>:用浮点数来定义缩放比例。不允许负值

<percentage>:用百分比来定义缩放比例。不允许负值

说明:

设置或检索对象的缩放比例。

对应的脚本特性为zoom

-----------------------------------------------延伸扩展------------------------------------------------

Zoom属性是IE浏览器的专有属性, 它可以设置或检索对象的缩放比例

在平常的css编写过程中,zoom:1能够比较神奇地解决ie下比较奇葩的bug。

譬如外边距(margin)的重叠,譬如浮动的清除,譬如触发ie的 haslayout属性等等。

总结:当设置了zoom的值之后,所设置的元素就会就会扩大或者缩小,高度宽度就会重新计算了,这里一旦改变zoom值时其实也会发生重新渲染,运用这个原理,也就解决了ie下子元素浮动时候父元素不随着自动扩大的问题

(1)Zoom属于IE浏览器的专有属性,火狐和老版本的webkit核心的浏览器都不支持这个属性。然而,zoom现在已经被逐步标准化,出现在 CSS 3.0 规范草案中,也就是CSS3中的transform: scale这个属性来实现

(2)Zoom属性是IE浏览器的专有属性, 它可以设置或检索对象的缩放比例

(3)Zoom属性会影响对象的所有子对象( children )。这种影响很像 background 和 filter 属性导致的变化。

(4)Zoom属性不允许负值。

© 著作权归作者所有

共有 人打赏支持
mxPickle
粉丝 0
博文 5
码字总数 2170
作品 0
深圳
前端工程师
aos.js超赞页面滚动元素动画jQuery动画库

插件描述:aos.js是一款效果超赞的页面滚动元素动画jQuery动画库插件。该动画库可以在页面滚动时提供28种不同的元素动画效果,以及多种easing效果。在页面往回滚动时,元素会恢复到原来的状态...

VIP_web
06/26
0
0
IE zoom:1 原理 以及应用

IE zoom:1 原理 zoom: 1 是为了 IE 早期的浏览器,有 layout 的毛病,所以用 zoom: 1 代表这个 div 是有高度宽度的 效果跟 overflow: hidden 可以装载浮动物件一样 我们经常在调试浏览器兼容...

柒月-小妖精
2015/09/10
131
0
认识hasLayout——IE浏览器css bug的一大罪恶根源

什么是hasLayout?hasLayout 是IE特有的一个属性。很多的ie下的css bug都与其息息相关。在ie中,一个元素要么自己对自身的内容进行计算大小和组织,要么依赖于父元素来计算尺寸和组织内容。当...

lixiaokai2008
2013/09/06
0
0
jquery实现图片放大效果应用jqeury插件

1,将 zoom.js 和 zoom.css 文件链接到您的网站或应用程序。 2,zoom.js依赖于transition.js文件,所以一定要调用。 3,添加一个数据操作="zoom"属性到你想要缩放的图像。例如┱ 详细请参考:...

kangjunfei
2017/10/19
0
0
CAD的图层设置及视图讲解

图层命令中,第一个是layer,图层属性管理器。里面的具体内容以前已较为详细的谈过,这里不再重复。和图层控制有关的其它命令,则都是让我们在绘图过程中如何方便控制图层的“开关(显示)”...

熊本二号
01/11
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Delphi 常用API 函数(好多都没见过)

AdjustWindowRect 给定一种窗口样式,计算获得目标客户区矩形所需的窗口大小 AnyPopup 判断屏幕上是否存在任何弹出式窗口 ArrangeIconicWindows 排列一个父窗口的最小化子窗口 AttachThread...

dillonxiao
13分钟前
1
0
阿里云ubuntu配置Android开发环境编译Apk

1.命令行下载Android SDK $ wget https://dl.google.com/android/android-sdk_r24.4.1-linux.tgz $ tar zxvf android-sdk_r24.4.1-linux.tgz 2.列出可以现在的SDK ./android list sdk  -a 3......

SuShine
13分钟前
1
0
maven导出项目依赖的jar包

一、导出到默认目录 targed/dependency 从Maven项目中导出项目依赖的jar包:进入工程pom.xml 所在的目录下,执行如下命令: mvn dependency:copy-dependencies 二、导出到自定义目录中 在mav...

来来来来来
14分钟前
1
0
Win10下React Native环境安装教程及错误处理办法(实测)

https://blog.csdn.net/zhangatle/article/details/53289471 准备工作 注意:小米手机MIUI有坑,文末有解决方法 1 首先,你需要先安装Node.js并进行环境变量的配置,具体可以参考我的另一篇文...

james_laughing
14分钟前
0
0
IDEA2018 Mybatis plugin破解

IDEA2018 Mybatis plugin破解 Mybatis Plugin 一、Mybatis Plugin插件是什么 提供Mapper接口与配置文件中对应SQL的导航 编辑XML文件时自动补全 根据Mapper接口, 使用快捷键生成xml文件及SQL...

DemonsI
15分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部