CSS动画_ 楠哥blog

CSS动画

2019-12-31 993 0 admin 所属分类:CSS

旋转动画

.demo {
	background-image: url('circular.png');
	width: 80px;
	height: 80px;
	position: absolute;
	webkit-animation: rotate 2s cubic-bezier(.4,.1,.4,1)infinite;
	-o-animation: rotate 2s cubic-bezier(.4,.1,.4,1)infinite;
	animation: rotate 2s cubic-bezier(.4,.1,.4,1)infinite;
}

@keyframes rotate {
	0% {
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}