scale和zoom区别

最新推荐文章于 2023-05-04 10:22:43 发布
最新推荐文章于 2023-05-04 10:22:43 发布
阅读量2.7k 收藏 1
点赞数
分类专栏： CSS 文章标签： zoom scale 缩放
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/mengshang529/article/details/92209779
版权
  1. zoom左上角缩放，scale默认中心缩放；scale可通过transform-origin来改变缩放焦点
  2. zoom缩放不可以是负数，scale可以是负数（详细用法请参考MDN）
  3. zoom缩放之后不占文档流，下方的元素会自动上移；scale缩放之后会仍然占据文档流(类似position：relative)
  4. room缩放之后，用js获取元素的宽高仍然是缩放之前的宽高；scale缩放之后，用js获取是缩放之后的宽高。
  5. 由于对文档流的影响，zoom会引起整个页面的重绘；而scale只改变的缩放的元素
  6. zoom在火狐上是不支持的（2019-06-15），请谨慎使用

Can I Use: zoom

CSS中的zoom属性和scale属性的用法及区别
12-13
zoom 属性语法：zoom：normal | <number> | <percentage>默认值：normal适用于：所有元素继承性：有取值：normal：使用对象的实际尺寸。<number>：用浮点数来定义缩放比例。不允许负值<percentage>：用百分比来定义缩放比例。不允许负值说明：设置或检索对象的缩放比例。对应的脚本特性为zoom。 Scale属性scale属性的取值为2个，它本身其实相当于一个函数，因为它的写法就和函数一样：scale();scale(x);scale(x,y);1、scale(x,y) 对元素进行缩放X表示水平方向缩放的倍数 Y表示垂直方向的缩放倍数Y是一个
多文档界面(MDI)VC源代码:zoom_scale
03-15
在Windows编程领域，多文档界面（Multiple Document ...以上就是关于MDI应用中实现“zoom_scale”功能的一些核心概念和技术细节。通过理解和应用这些知识点，开发者可以创建出具备灵活缩放功能的多文档界面应用程序。
scale与zoom的差异
飞天代码的博客
06-29 3156
最近做表单打印功能，有个放大、缩小功能。一开始ie和chrome采用的zoom来实现，firfox采用的-moz-transform实现的。以为大功告成，但测试发来了个bug，说chrome下缩小一定程度后 表单变形了，如图： 字体被压成多行了而且边线也没了。但ie和firefox上都是正确，不会变形。 当时收到bug，都想骂人了这谁能搞定，程序能干预的都干预了，这个是浏览器zoom自带的...
zoom与scale的区别
weixin_30836759的博客
06-07 289
最近做了两个项目，一个需要对字体缩小，小于默认的字体大小(12px),最后使用transform:scale(0.9),但整个元素宽高都被缩小了，感觉很不好~~~做另外一个项目要求将整体页面安一定比例缩小，最初使用了scale,缩小是达到了，但页面位置已经不晓得跑哪去了，于是改用zoom,看着舒服多了，于是我就想用zoom缩放字体，
关于scale和zoom的区别
weixin_30564901的博客
05-19 333
其实关于scale，我之前是用他来搞一些css3的特效的放大缩小啊，玩的也挺6666，而*zoom：1之前是用来做css的hack，也就是触发IE6/7的haslayout清除浮动的。终于某天，好事的UE说1px的线在retina的屏幕下显得膀大腰圆要我们修复这个bug。参考http://www.tuicool.com/articles/ZRv6bun，在做了一系列的实验之后采取了使用scale...
页面缩放兼容性处理方法(zoom,Firefox火狐浏览器)
12-12
可以使用用浮点数和百分比来定义缩放比例。 zoom的浏览器兼容性：http://caniuse.com/#search=zoom zoom的兼容性：firefox 全系列不支持。 （2）transform transform:scale(1.1,1.1); scale(x,y) 定义 2D 缩放转换...
ngx-pinch-zoom:模块提供了使用触摸屏上的手势进行图像缩放和定位的功能
05-14
夹角变焦 该模块提供了使用触摸屏上的手势进行图像放大，缩小和定位的机会。...meta name =“ viewport” content =“ width = device-width，initial-scale = 1，maximum-scale = 1.0，user-scala
CSS中两种放大zoom和scale的区别
热门推荐
积少成多
02-08 3万+
欢迎访问我的个人博客 http://xiaolongwu.cn/ 先说原理 zoom和scale这两个东西都是用于对元素的缩放，但两者除了兼容性之外还有一些不同的地方。 zoom缩放会将元素保持在左上角，而scale默认是中间位置，可以通过transform-origin来设置。 另外他们执行的渲染顺序也不同zoom可能影响到盒子的计算。 我们看个例子 这是几行伪代码 ...
【zoom和scale的区别】
GreenHand_000的博客
12-16 1257
zoom 一、 style 部分 //打底 .BottomLayer { width:600px; height:600px; background-color:green } html 部分 div class="BottomLayer "> </div> 如图： 二、 在BottomLayer 中在添加一个class为zoom的div <div class="BottomLayer "> <div class="zoomOrScale"> <
css3动画属性系列之transform细讲scale缩放
dengliu_2017的博客
10-30 499
1、scale(x,y)对元素进行缩放 X表示水平方向缩放的倍数 | Y表示垂直方向的缩放倍数 Y是一个可选参数，没有设置的话，则表示X，Y两个方向的缩放倍数是一样的。并以X为准。 transform:scale(2,2.5); 2、scaleX(<number>)元素只在X轴（水平方向）缩放元素...
css zoom与scale区别
weixin_33816946的博客
12-05 251
转自：http://www.zhangxinxu.com/wordpress/2015/11/zoom-transform-scale-diff/ 1、zoom的缩放是相对于左上角的；而scale默认是居中缩放； 2、zoom的缩放改变了元素占据的空间大小；而scale的缩放占据的原始尺寸不变，页面布局不会发生变化；所以二者会导致渲染的性能差异。 3、对文字的缩放规则不一致。zoom缩放依然...
组件等比例放大——scale和zoom
HYeeee的博客
05-04 1781
使用方式一 { renderer : ‘svg’} 可以解决放大文字模糊的问题，但如果使用domtoimg插件截图，dom显示正常的情况下，截出的图片会出现文字放大、tooltip文字重叠的问题。使用方式二不会出现放大问题，但截图结果比dom显示的文字要模糊，只能将devicePixelRatio设置调大来处理。问题： scale放大，占据宽高不变，导致内容高度不够，锚点定位到最后，菜单上移消失问题。加载完之后，获取放大后的高，在html中设置该高度。还有锚点的交互，和滚动定位，可以定位到。
zoom与scale的异同
weixin_30735391的博客
06-28 223
zoom与scale的异同点 作为一名前端，尤其是页面要兼容ie浏览器的前端，肯定对着两个属性都很熟悉。 zoom和scale都是css中常用的放大和缩小一个元素的方法，在scale还没有成为css3标准之前，我们“唯一”能用来放大和缩小一个元素的方法也就是zoom。不过这个属性兼容性不好，因为这个属性是ie发明的，其他浏览器厂商都喜欢跟ie对着干，对这个属性不怎么感冒，所以不怎么支持。这就导...
iOS: UIScrollView的属性zoomScale
Alisa200920的专栏
08-12 1537
@property(nonatomic) float zoomScale
一个zoomScale的怪坑
dianpinxiao7850的博客
12-09 532
//重置单元格内元素尺寸 func resetSize() { scrollView.frame = self.contentView.bounds scrollView.contentSize = self.contentView.bounds.size scrollView.zoomScale = 1.0 ...
iOS: UIScrollView的属性maximumZoomScale
Alisa200920的专栏
08-10 2041
@property(nonatomic) float maximumZoomScale
zoom和transform:scale()的区别
充电五分钟...
08-22 2274
文章目录1. 兼容行区别2. 控制缩放的属性值不一样3. zoom缩放会将元素保持在左上角，而scale默认是中间位置，可以通过transform-origin来设置4. 对文字的缩放规则不一致5. 执行的渲染顺序不同 总结： zoom 不兼容火狐 zoom 使等比例缩放，scale可以只缩放一个方向；属性值也不同 zoom缩放基点是左上角，scale 是中心位置，用transform-orgin来改变 zoom缩放文字受12好字体限制，scale 可以缩小到12号字体一下 zoom 先缩放再渲染，s
scale 和 zoom，以及zoom的一些变态用法
weixin_33939380的博客
06-22 320
zoom和scale这两个东西都是用于对元素的缩放,一下是其中一些区别： 1、scale的缩小是以图片的中心，zoom的缩小是以图片的左上角。 2、zoom的缩放改变了元素占据的空间大小；而scale的缩放占据的原始尺寸不变，页面布局不会发生变化； 3、注意：如果给zoom赋值两次，会使zoom的最终值为二者的乘积 关于zoom的一些变态用法： 1、如果zoom与position共...
image_data = zoom(image_data, [scale, scale, 1], order=1, mode='nearest')
最新发布
12-13
这里，[scale, scale, 1]表示在高度和宽度方向上缩放因子为`scale`，而在通道方向上缩放因子为1（即不缩放通道数）。 3. **order=1**：这个参数指定了插值方法的阶数。`order=1`表示使用线性插值，这是一种常用的...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值