css3 animation-delay属性笔记

原创 PHP笔记  2017-09-17 18:26  阅读 917 views 次

css中,animation-delay属性是用来定义动画多少秒(s)或毫秒(ms)后开始,其值为时间。值可以是负值,代表跳过前多少秒或毫秒进入动画,默认值为0。单位可以是秒和毫秒。

语法格式:

animation-delay: time;

实例:

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>css animation-delay属性笔记</title>
<style>
#ad
{
width:200px;
height:100px;
background:red;
position:relative;
animation:mymove 6s infinite;
animation-delay:1s;
}
@keyframes mymove /*div块从左到右移动*/
{
from {left:0px;}
to {left:300px;}
}
</style>
<head/>
<body>
<div id="ad"></div>
</body>
</html>

运行结果:

注意:animation-delay属性不兼容Internet Explorer 9以及更早版本的浏览器

动画简写属性——>css3 animation动画属性笔记

本文地址:https://www.ggbiji.com/css-animation-delay.html
版权声明:本文为 PHP笔记 原创/整理文章,欢迎分享,转载请注明出处!

发表评论


表情