如何使用-moz-transform缩放?

时间:2010-07-20 10:15:01

标签: css firefox css3 transform

任何正文都有一个很好的例子,说明如何使用-moz-transform

3 个答案:

答案 0 :(得分:9)

The MDC page you linked to实际上解释得非常好。

我给你一个简单的例子。演示:http://jsfiddle.net/SZ87b/1/代码:

<!doctype html>
<title>-moz-transform scale example</title>
<style>
 p { font-size: 5em; text-align: center; }
 p:hover { -moz-transform: scale(2); }
</style>
<p>Foo bar</p>

答案 1 :(得分:6)

这是市长浏览器的css示例 值刻度(2,4)将宽度转换为原始大小的两倍,高度为原始大小的4倍。

div{
transform: scale(2,4);
-ms-transform: scale(2,4); /* IE 9 */
-webkit-transform: scale(2,4); /* Safari and Chrome */
-o-transform: scale(2,4); /* Opera */
-moz-transform: scale(2,4); /* Firefox */
} 

答案 2 :(得分:2)

使用缩放(或旋转)变换时,您可能需要设置原点。

  transform-origin: top left;

获得您正在寻找的效果。