CSS3のtransformでテキストや画像を動かします!!
ベンダープレフィックスは省略しています。
要素の回転を指定します。
transform: rotate();・・・XとYを同時に指定
transform: rotateX();
transform: rotateY();
#txt01 {
animation: animation01 2s infinite ease 1s both;
}
@keyframes animation01 {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
aaaaaaa
transform: rotateX();
#txt02 {
animation: animation02 2s infinite ease 1s both;
}
@keyframes animation02 {
from {
transform: rotateX(0deg);
}
to {
transform: rotateX(360deg);
}
}
aaaaaaa
transform: rotateY();
#txt03 {
animation: animation03 2s infinite ease 1s both;
}
@keyframes animation03 {
from {
transform: rotateY(0deg);
}
to {
transform: rotateY(360deg);
}
}
aaaaaaa
参考サイト
