CSS3中Transform动画属性用法详解
|
-o-transform:skew(30deg,-20deg); /* Opera */ transform-origin:100% 100%; /* W3C标准 */ -ms-transform-origin:100% 100%; /* IE 9 */ -moz-transform-origin:100% 100%; /* Firefox */ -webkit-transform-origin:100% 100%; /* Safari 和 Chrome */ -o-transform-origin:100% 100%; }
</style> </head> <body> <div id="container"> <div id="div1"> <div>translate(基点为(left top)</div> </div> <div id="div2"> <div>rotate(基点为(0%, 0%)</div> </div> <div id="div3"> <div>scale(基点为(center, top)</div> </div> <div id="div4"> <div>skew(基点为(100%, 100%)</div> </div> </div> </body> </html>
效果如下：
对比发现：translate()方法与之前的没有区别，其他三个方法基点改变了，图形变形效果也有所变化。 3D transform变换方法 Internet Explorer 10 和 Firefox 支持 3D 转换. （编辑：焦作站长网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
