CSS3中Transform动画属性用法详解
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 转换. (编辑:晋中站长网) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |