css3实现某个div成一定角度旋转 -webkit-transform: rotate(40deg)

资料来源：网络整理时间：2023/2/14 0:05:08 共计：3569 浏览

目前越来越多的浏览器兼容CSS3标准了，就连IE浏览器老大哥也开始向CSS3低头，微软宣布IE9浏览器支持更多的CSS3属性，IE9更注重HTML5标准。不过CSS3里有一个使对象旋转的属性transform rotate，号称兼容CSS3的浏览器对它的支持也不算好，好在Firefox、Webkit和Opera这些浏览器都已经提供了官方的hack去支持这个属性。唯独在IE浏览器里对这个transform属性无法通过一般的CSS写法去实现。
在W3C官方的标准里，通过transform属性使对象旋转的写法如下：

Div旋转一定的角度
所有的css3样式 -webkit-transform: rotate(40deg)/* 其中40是旋转的角度 */

<div id="test-webkit-transform: rotate"
style="margin:300px 0 0 300px;width:100px ; height:100px; background-color:#0CF; -webkit-transform:rotate(10deg); float:left;">
<div style="background-color:#F00; width:10px; height:10px; "></div>
</div>

Tip：transform一个相当复杂的属性，目前可以实现旋转和动画效果，我认为这个属性在CSS3标准完全确定下来以后会变得更加强大。

版权说明：
本网站凡注明“广州京杭原创”的皆为本站原创文章，如需转载请注明出处！
本网转载皆注明出处，遵循行业规范，如发现作品内容版权或其它问题的，请与我们联系处理！
欢迎扫描右侧微信二维码与我们联系。

·上一条：C# Post接收发送XML | ·下一条：CSS3 border-radius 属性