css3 @keyframes 动画

使一个元素逐渐向下移动

@keyframes mymove
{
from {top:0px;}
to {top:200px;}
}

@keyframes mymove
{
0%   {top:0px;}
25%  {top:200px;}
50%  {top:100px;}
75%  {top:200px;}
100% {top:0px;}
}

做一个显示隐藏的动画

@keyframes opc {
	0%, 50%, 100%{opacity:1},
	25%{opacity:0}
}

/* 引入动画 */
/* liner 匀速播放， infinite 重复播放，alternate逆向播放 */
.class {animation: opc linear 1s infinite alternate}