、动画速度曲线设置
CSS3 样式中 , 设置 动画速度曲线 的属性是 animation-timing-function 属性 ;
animation-timing-function 属性定义了动画从...速度曲线 , 贝塞尔曲线 , 该属性值的 四个参数 用于定义贝塞尔曲线的控制点 ;
steps(n) : 指定动画的步长 , 默认情况下是无级变速 , 也就是动画以微小趋势运行 , 整个过程动画可能变换几十次到数百次不等..., 如果设置为 3 步长 , 动画只会变换 3 次 ;
令动画 低速开始 加速执行 低速结束 , 可以对执行动画的 标签元素 设置如下属性 :
animation-timing-function: ease-in-out...-- 设置 meta 视口标签 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable...200 像素 ;
三、代码示例 - 使用动画步长实现打字机效果
----
实现思路 :
在盒子模型中 , 设置 10 个文字 :
实现一个打字机效果吧
动画的效果是 盒子模型 从