CSSのanimationとtransform、translate、rotateY、scaleプロパティを使う

CSSのキーフレームanimationとtransform、translate、rotateY、scaleプロパティを使う


animationとtransform

.imgani{animation: imgani 1.0s linear 0.00s 1 normal both running;}
@keyframes imgani
    0%{transform:translate(0px,200px) rotateY(-360deg) scale(0.01);opacity:0.0;}
  100%{transform:translate(0px,  0px) rotateY(   0deg) scale(1.00);opacity:1.0;}
}
1秒間でキーフレームアニメーションでY軸座標、Y軸回転角、拡大縮小率、透明度を変化させています。

Mam's WebSite