什么是'；缩放'；你喜欢CSS吗？

我发现一些jQuery插件，在他们的css规则中使用了“缩放”描述符，我甚至查看了w3c网站，发现它被用来放大，但我如何才能真正实现它呢？或者我必须定义一些视口？我如何定义这样的视口？还是我错了

可以这样使用吗

a {
    zoom:1;
}

a:hover {
   zoom:2;
}

---

只有IE和WebKit支持zoom，是的，理论上它完全符合你的意思

---

在图像上试用以查看其全部效果：）

此属性控制当前元素的放大级别。元素的渲染效果是摄影机上的“缩放”功能。即使此属性未被继承，它仍会影响子元素的呈现

范例

 div { zoom: 200% }
 <div style=”zoom: 200%”>This is x2 text </div>

div{zoom:200%}
这是x2文本

正如Joshua M所指出的，缩放功能不仅在Firefox中受支持，但您可以简单地修复它，如图所示：

div.zoom {
  zoom: 2; /* all browsers */
 -moz-transform: scale(2);  /* Firefox */
}

---

CSS规范中不包括缩放功能，但IE、Safari 4、Chrome都支持缩放功能（从3.5开始，您可以在Firefox中通过

-moz transform:scale（x）

获得类似的效果）。看

所以，所有浏览器

 zoom: 2;
 zoom: 200%;

将您的对象放大2倍，就像将大小放大一倍。也就是说如果你有

a:hover {
   zoom: 2;
}

悬停时，

。此外，Opera中似乎不支持
zoom

post提供了一个有用的洞察方法来解决与
scale
的不兼容问题，以及使用jQuery的解决方法。
令人惊讶的是，没有人提到
zoom:1
对于IE6-7非常有用，可以通过触发来解决大多数只支持IE的bug。
zoom是@viewport描述符的css3规范，如下所述


用于缩放整个视口（“屏幕”）。
它也会在很多浏览器中缩放单个元素，但不是全部。
css3规定变换：应使用缩放来实现这种效果：


但它的工作原理与那些支持它的浏览器中的“元素缩放”略有不同。
CSS
zoom
属性现在得到了广泛的支持，占浏览器总数的86%

见：


document.querySelector（'#sel jsz'）.style.zoom=4
#sel-001{
变焦：2.5；
}
#sel-002{
变焦：5；
}
#sel-003{
缩放：300%；
}
IMG-默认值
IMG-1X
IMG-5X
IMG-3X
JS Zoom-4x
False。IE、Opera、Safari 4、Chrome和Firefox从3.5.Ah起就支持缩放功能，并带有
-moz transform:scale（x）
；上次我试了一下，没有任何效果。CSS3转换实际上并不相同，所以Firefox不支持它。也许从其他浏览器的CSS3开始，内部的“缩放”是通过转换来表示的。实际上，从快速测试来看，缩放在Opera中似乎也不起作用。所以你的意思是，它在IE和WebKit中工作。zoom，正如预期的那样，只需缩放：；）您应该将jQuery插件中实际使用的代码复制到您的问题中。最有可能的是，使用它的原因是提供Ilia Akhmadullin提到的hasLayout。由于浏览器支持不完整，任何人都不应使用
zoom
属性来实际“缩放”。
zoom
和
transform:scale（）
有显著差异。转换原点很容易确定，但是
transform
不会影响内容流，而
zoom
不会影响内容流这一事实并不容易确定。此外，
zoom
在Opera中似乎不受支持。“你真的应该编辑你的答案，现在它有误导性。”三十点修正了我的答案。谢谢。在zoomHi中使用z-index会很有趣，我建议您对这个答案进行更多的修改，以澄清以下几点：a）zoom属性不是标准化的，所以理想情况下应该避免使用b）带有-moz-前缀的属性（任何前缀，Firefox都更具原则性）它们也是实验性的，当有了标准化的做事方式时，它们将被删除。现在，使用或推荐-moz变换不是一个好主意。@hallvors问题不是我应该使用zoom，而是zoom做什么。答案中也有不兼容性，并给出了相关的支持信息。这是两个完全不同的属性，尽管它们产生相似的结果。您的示例会将其缩小到25%，而不是50%。从问题中可以非常清楚地看出，这不是您正在谈论的
zoom
。是的：-），但严格来说，如果问题是“缩放在css中做什么”，这是根据css规范给出的答案。这是afaik唯一的官方变焦，因此所有的混乱。