css 中的zoom,对CSS中zoom属性的总结

在css中，zoom属性作用是设置或检索对象的缩放比例。对应的脚本特性为zoom。虽然很多人都知道，但是任然有人不知道zoom的具体的用法，或者没有深究过，下面就把zoom的用法总结一下：

1.CSS样式中属性zoom：1的作用详解

CSS中zoom:1的作用

兼容IE6、IE7、IE8浏览器，经常会遇到一些问题，可以使用zoom:1来解决，有如下作用：

触发IE浏览器的haslayout

解决ie下的浮动，margin重叠等一些问题。

2.CSS中zoom属性或overflow:auto属性清除浮动

其实在CSS中的Zoom这个属性一般不为人知，甚至有些CSS手册中都查询不到。其实Zoom属性是IE浏览器的专有属性，Firefox等浏览器不支持。它可以设置或检索对象的缩放比例。除此之外，它还有其他一些作用，比如触发ie的hasLayout属性，清除浮动、清除margin的重叠等。

3.zoom和transform:scale()的区别

zoom和transform:scale()都可以用于缩放，目前移动端存在各种各样不同屏幕大小的手机，为了兼容不同宽度的屏幕，我们可以基于某一屏幕宽度大小(比如iPhone5的320，这个根据设计稿来)做出页面后，再对页面进行缩放以兼容其他屏幕宽度。

4.css中的zoom的使用

zoom : normal | number

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

number :　 百分数 | 无符号浮点实数。浮点实数值为1.0或百分数为100%时相当于此属性的 normal 值用白话讲解就是zoom:后面的数字即放大的倍数，可 以是数值，也可以是百分比。如：zoom:1，zoom:120%。

ps：网上都说是ie的专有属性，本人亲测chrome下也可以使用；(Firefox浏览器不支持)

zoom属性相关的问答：

1.css zoom 如何计算控制页面大小？

2.zoom 放大背景图怎么是从页面左上角开始放大的？

3.使用css中的zoom:50%后对页面文字大小不生效，什么原因？