码迷,mamicode.com
首页 > Web开发 > 详细

css3另一个属性写法

时间:2018-02-06 20:13:49      阅读:197      评论:0      收藏:0      [点我收藏+]

标签:ini   无限   bsp   运动   nim   另一个   class   循环   mat   

使用@keyframes name{}属性来实现自动的移动效果如下,可以使用infinite来实现无限循环播放。也可以规定循环次数,只需把infinite更换为想要播放的次数即可:

还可以通过animation-direction(反向)属性来反过来。

.seser{
    width:200px;
    height:200px;
    background:#F00;
    /*给元素指定一个运动*/
    animation:run 2s infinite;
}

/*规定运动规则*/
@keyframes run{
    0%{
        width:200px;
    }

    50%{
        width:600px;
    }
    100%{
        width:200px;
    }
}

 

css3另一个属性写法

标签:ini   无限   bsp   运动   nim   另一个   class   循环   mat   

原文地址:https://www.cnblogs.com/luohaiwenhtml/p/8423547.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!