css3で回転(時計回り)
2018年5月18日 css3
CSS3で2D右回転アニメーションしてみました。
.rote {display:block; width:100px;animation: rote 1.5s ease 0s infinite;} @keyframes rote { 0% {transform: rotate(0deg);} 50% {transform: rotate(-180deg);} 100% {transform: rotate(360deg);} }
回転します
-指定で逆回転です。
値を変更できます。
ease
linear
ease-in
ease-out
ease-in-out
右側は0sからイーズを持たせるかどうか。
infiniteは無限ループ