一尘不染

CSS中的“缩放”功能是什么?

css

我发现某些jQuery插件在其css规则中使用“
zoom”描述符,我什至查看w3c网站,也发现它用于放大,但是我实际上如何实现呢?还是我必须定义一些视口?以及如何定义这样的视口?还是我对整个事情都错了?

有可能像这样使用它吗

a {
    zoom:1;
}

a:hover {
   zoom:2;
}

阅读 397

收藏
2020-05-16

共1个答案

一尘不染

CSS规范中未包含缩放功能,但IE,Safari4,Chrome支持缩放功能(-moz-transform:scale(x)从3.5开始,您可以在Firefox中获得类似的效果)。

因此,所有浏览器

 zoom: 2;
 zoom: 200%;

会将您的对象放大2倍,就像放大一倍。这意味着如果你有

a:hover {
   zoom: 2;
}

悬停时,<a>标签将放大200%。

就像我说的那样,在FireFox 3.5+中-moz-transform: scale(x),它执行的功能大致相同。

编辑:针对的评论thirtydot,我会说这scale()不是一个完整的替代。它不会像行中一样扩展zoom,而是会立即扩展并扩展内容,而不会强迫其他内容。在这里查看此操作。此外,zoomOpera不支持该功能。

这篇文章scale对使用jQuery解决不兼容的方法和变通方法提供了有用的见解。

2020-05-16