当前位置 : 主页 > 网页制作 > css >

使用CSS从右向左旋转图像

来源:互联网 收集:自由互联 发布时间:2021-06-13
是否可以使用纯CSS在DIV中从右向左旋转图像我的意思是不使用任何 JavaScript? 这可以使用CSS3的转换:rotate(…)或一些专有的IE过滤器.见 an example或 the specification. 例如 position:absolute;-moz
是否可以使用纯CSS在DIV中从右向左旋转图像我的意思是不使用任何 JavaScript? 这可以使用CSS3的转换:rotate(…)或一些专有的IE过滤器.见 an example或 the specification.

例如

position:absolute;
-moz-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
-o-transform: rotate(90deg); /*opera*/
transform: rotate(90deg); /*likely future standard*/
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
/*for filter: 1==90deg, 2==180deg, 3==270deg*/

请注意,此变换是渲染变换;所以旋转不会影响布局(类似于位置:相对内容).这就是为什么绝对定位通常是这里最简单的使用途径.另外,请注意规范不是最终的;细节可能会改变(特别是,变换如何与布局相互作用 – 坚持位置的另一个原因:绝对;).

最后,您可能对动画过渡感兴趣;作为一个随机的googled示例你可以看看here.这些还没有最终确定,虽然部分在firefox,webkit和opera中实现:标准可能会坚持的标志.不间断动画是Apple提案,到目前为止仅在webkit中实现,并且比转换复杂得多;除了技术演示之外,我会远离这些,因为标准可能会以可能复杂的方式发生变化.

网友评论