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