<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<title>Title</title>
</head>
<style>
.hideAdd{
animation:myanimation 3s;
-webkit-animation:myanimation 3s;
position: absolute;
top:0;
animation-fill-mode:forwards; //当动画完成后，保持最后一个属性值
}
@keyframes myanimation
{
from {top:0;opacity: 1}
to {top:-20px;opacity: 0}
}
@-webkit-keyframes myanimation
{
from {top:0;opacity: 1}
to {top:-20px;opacity: 0}
}
</style>
<body>
<br/>
<br/>
<br/>
<div class=”hideAdd”>+100</div>
</body>
</html>
