SOURCE

<div class="cell">  
  <div class="num">5 4 3 2 1 0</div>
  <!-- <div class="num">五 四 三 二 一 零</div> -->
</div> 

body{  
  background:#333;  
}

.cell{  
    width: 1em;    
    height: 1em;  
    /* border:1px dashed rgba(255,255,255,0.1); */  
    font-size:120px;  
    font-family:Frijole;  
    overflow: hidden;  
    position:absolute;  
    top:50%;  
    left:50%;  
    margin:-0.5em 0 0  -0.5em;  
    opacity:0;  
    animation:go 6s;  
    transform-origin:left bottom;  
}

.num{  
    position:absolute;  
    width: 1em;  
    color:#E53F39;  
    line-height: 1em;    
    text-align: center;  
    text-shadow:1px 1px 2px rgba(255,255,255,.3);  
    animation:run 6s steps(6);  
}

@keyframes run{  
    0%{top:0;}  
    100%{top:-6em;}  
}

@keyframes go{  
  0%   {opacity:1;}  
  84%  {opacity:1;transform:rotate(0deg) scale(1);}  
  100% {opacity:0;transform:rotate(360deg) scale(.01);}  
}