css旋转
    Html
    Css
    Js

    
                        
@-webkit-keyframes rotation {
	from {
	-webkit-transform:rotate(0deg);
}
to {
	-webkit-transform:rotate(360deg);
}
}.rotation {
	-webkit-transform:rotate(360deg);
	animation:rotation 2.7s linear infinite;
}
@-webkit-keyframes ro {
	from {
	-webkit-transform:rotate(0deg);
}
to {
	-webkit-transform:rotate(-360deg);
}
}.ro {
	-webkit-transform:rotate(-360deg);
	animation:ro 3.4s linear infinite;
}
@-webkit-keyframes ro1 {
	from {
	-webkit-transform:rotate(0deg);
}
to {
	-webkit-transform:rotate(360deg);
}
}.ro1 {
	-webkit-transform:rotate(360deg);
	animation:ro1 5.1s linear infinite;
}
.common {
	width:120px;
	height:20px;
	line-height:36px;
	cursor:pointer;
	border-radius:250px;
	color:white;
	text-align:center;
	box-shadow:0 0 2px red;
}
.container {
	position:relative;
	top:15px;
	left:15px;
	width:110px;
	height:110px;
	border:3px solid #13da73;
	line-height:110px;
	text-align:center;
	font-size:80px;
}
.main {
	position:relative;
	top:15px;
	left:15px;
	width:140px;
	height:140px;
	border:3px solid #fb1fba;
	line-height:140px;
}
.main1 {
	width:180px;
	height:180px;
	border:3px solid #3ce20f;
	line-height:180px;
	float:left;
}
.Qmain {
	width:900px;
	height:250px;
	margin:0 auto;
	padding-top:50px;
}

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.11.3
 立即下载

css旋转

这个东西不是自己的原创,很佩服原创,想让更多的人看到此信息

0