语意化的html css
.container
.page 单页
.slideIn 页面出现动画
animation
.page,.slideIn { animation:a .2s forwards; } @-webkit-keyframe a{ 0%{ -webkit-transform:translate3d(100%,0,0); transform:translate3d(100%,0,0); opacity:0 } to{ -webkit-transform:translateZ(0); transform:translateZ(0); opacity:1 } }
slideIn 页面载入良好效果由opacity 0 -> 1 transform 100%-> 0 animation 实现 to 目标的状态 forwards 保持最后的状态
原文：http://www.cnblogs.com/gzz-1994/p/5304874.html