zoom和transform:scale的区别

1、zoom:

  以前只是看到别人的代码中用过zoom,自己从未使用过,今天在探究ie7兼容inline-block时,发现里面提到了zoom。下面开始进行对zoom的探究。

  zoom:normal | <number> | <percentage>
    默认值:normal
    适用于:所有元素
    继承性:有
    动画性:是
    计算值:绝对长度
  取值:
    normal:
          使用对象的实际尺寸。(等同于zoom:1)
    <number>:
          用浮点数来定义缩放比例。不允许负值
    <percentage>:
          用百分比来定义缩放比例。不允许负值

  兼容性:

Zoom的字面意思是“变焦”,摄影的时候常用到的一个概念。对于web上的zoom效果,你也可以按照此概念理解。可以改变页面上元素的尺寸,属于真实尺寸。在以前,zoom可以给IE6/IE7浏览器增加haslayout, 用来清除浮动,修复一些布局上的疑难杂症等。

2、transform:scale

  transform:scale是css3变形中的缩放

  语法为:transform: scale(<x> [<y>]). 同时有scaleX, scaleY专门的x, y方向的控制。(这里不专门介绍transform:scale)
  和zoom不同,scale并不支持百分比值和normal关键字,只能是数值。而且,还能是负数,没错,负数。而zoom不能是负值!

Example:

100251_POOR_3188886.png

转载于:https://my.oschina.net/u/3188886/blog/1529752

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值