css3怎么设置永久旋转
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了css3怎么设置永久旋转相关的知识,希望对你有一定的参考价值。
参考技术A transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。代码如下:可以复制运行下试试:
<html>
<head>
<style>
body
background:#ddd;
.keleyi
width: 220px;
height: 220px;
margin: 0 auto;
background: no-repeat url("http://keleyi.com/image/a/q5l1xnmf.jpg") left top;
-webkit-background-size: 220px 220px;
-moz-background-size: 220px 220px;
background-size: 220px 220px;
-webkit-border-radius: 110px;
border-radius: 110px;
-webkit-transition: -webkit-transform 2s ease-out;
-moz-transition: -moz-transform 2s ease-out;
-o-transition: -o-transform 2s ease-out;
-ms-transition: -ms-transform 2s ease-out;
.keleyi:hover
-webkit-transform: rotateZ(360deg);
-moz-transform: rotateZ(360deg);
-o-transform: rotateZ(360deg);
-ms-transform: rotateZ(360deg);
transform: rotateZ(360deg);
</style>
</head>
<body>
<div class="keleyi"></div>
</body>
</html> 参考技术B 图片?自动旋转还是鼠标经过
以上是关于css3怎么设置永久旋转的主要内容,如果未能解决你的问题,请参考以下文章