css动画

2019-08-14 09:49:56来源:博客园 阅读 ()

新老客户大回馈,云服务器低至5折

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>

 

欢迎评论??


原文链接:https://www.cnblogs.com/zy22333/p/11209685.html
如有疑问请与原作者联系

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:默认文档解析--手机web app开发笔记(二)

下一篇:HTML连载24-属性选择器(下)