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

css动画

时间:2019-08-26 09:39:36      阅读:105      评论:0      收藏:0      [点我收藏+]

标签:定义   key   height   ati   idt   first   back   效果   使用   

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动画

标签:定义   key   height   ati   idt   first   back   效果   使用   

原文地址:https://www.cnblogs.com/lee1-w/p/11410462.html

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