css动画

Posted 2022-08-27 lee1-w

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了css动画相关的知识，希望对你有一定的参考价值。

css的动画效果在style标签中用@keyframes name。。。的形式定义，使用animation：name time 。。。的形式进行调用。

示例：

<style>

@keyframes myfirst

0%   background: red; left:0px; top:0px;
25%  background: yellow; left:200px; top:0px;
50%  background: blue; left:200px; top:200px;
75%  background: green; left:0px; top:200px;
100% background: red; left:0px; top:0px;

div

width:100px;
height:100px;
background:red;
position:relative;
animation:myfirst 5s;

</style>

以上是关于css动画的主要内容，如果未能解决你的问题，请参考以下文章