初学者--动画----在路上

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了初学者--动画----在路上相关的知识,希望对你有一定的参考价值。

关于动画的基础属性:

动画结束后的状态 是否保留动画效果

animation-fill-mode: forwards;
无限次播放
animation-iteration-count:infinite;
动画延时
animation-delay:1s;
动画暂停
animation-play-state: paused;
动画反方向运动
animation-direction: alternate;
动画线性匀速执行
animation-timing-function: linear;

动画相比过渡可以控制更多细节,可以将一个动画拆成多个步骤

这里的比例划分随意。在这以三部分划分
@keyframes animation名{

    0%{

   宽高颜色背景啊...要改变的属性;

     }

    50%{

      同上

      }

    100%{

      同上

      }

   }

当然也可以分别设置动画过度要改变的属性执行时间

transition: height 2s, width 0.5s; 

-----------------------------------------------------------------------技术分享-------------------------------------------------------------------------

以上是关于初学者--动画----在路上的主要内容,如果未能解决你的问题,请参考以下文章

致Python初学者-从入门到爬虫开发,这一篇文带你省略学习路上的歪歪扭扭

致Andorid初学者-从入门到精通,这一篇文带你省略学习路上的歪歪扭扭

致Java初学者

致Java初学者

玖哥乱弹Android初学路上会遇到的瓶颈

JS 实现无缝滚动动画原理(初学者入)