http://www.w3school.com.cn/tiy/t.asp?f=css3_animation1
<!DOCTYPE html>
<html><head>
<style>
img
{
animation:myfirst 5s;
-webkit-animation:myfirst 5s; /* Safari and Chrome */
transform: rotateX(0deg);
-webkit-transform: rotateX(0deg);
}
@keyframes myfirst
{
from {width: 800px; height:800px;left: 100px; top: -200px; position: fixed;z-index: 302;display: block;}
to {width: 0px; height: 0px;padding: 0px; left:200px; top: 200px;position: fixed;z-index: 302;display: block;}
from {
transform: rotate(0deg) translate(0px) ; translate(100px);
}
to {
transform: rotate(360deg) translate(0px) ; translate(100px) ;
}
}
</style>
</head>
<body>
<div>
<img src="//bdaladdin.duapp.com/blackhole/img/blackhole.png" overflow: hidden;/></div>
</body>
</html>