ppt的动画效果怎么全部应用:跟我做css3的ppt（Animation介绍&Animate.css应用）-PPT教程-PPT教程网

下面的是PPT教程网给你带来的相关内容：

ppt的动画效果怎么全部应用:跟我做css3的ppt（Animation介绍&Animate.css应用）

跟我做css3的ppt（介绍&.css应用）

一、前言

上一篇文章《翻滚吧少年！（自定义css3动画过渡中的贝塞尔曲线）》我简单介绍了css3中的使用，和自定义过渡中的贝塞尔曲线，效果已经很好了，但有一个比较明显的缺点就是还动画方面还不够强大，只能定义开始和结束的状态ppt的动画效果怎么全部应用:跟我做css3的ppt（Animation介绍&Animate.css应用），如果我要详细控制多个阶段的动画效果，实现更多的效果应该怎么办呢，其实css3中年有专门为动画而设的属性：（目前测试兼容、、ie10+）

二、介绍和demo

其实和flash中的动画差不多，有一个关键属性“”ppt的动画效果怎么全部应用，用与定义不同阶段属性变化，下面用一个例子看看就知道了，核心代码：

    @keyframes bigBoy {
        0% {
            margin-left: 0;
            width: 35px;
            height: 35px;
            line-height: 35px;
            background: #f07709;
        }
        50% {
            margin-left: 180px;
            width: 70px;
            height: 70px;
            line-height: 50px;
            background: #c00;
        }
        100% {
            margin-left: 360px;
            width: 35px;
            height: 35px;
            line-height: 35px;
            background: #514bad;
        }
    }
    .demo:hover .box {
        animation-name: bigBoy;
        /*动画属性名，也就是我们前面keyframes定义的动画名*/
        animation-duration: 2s;
        /*动画持续时间*/
        -webkit-animation-name: bigBoy;
        /* 兼容webkit内核 */
        -webkit-animation-duration: 2s;
        /* 兼容webkit内核 */
    }