您的位置：首页 > Web前端 > CSS

一个浮动 css3效果

2017-03-15 13:06 204 查看

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
div{
background: #639;
width: 235px;
height: 216px;
position: absolute;
top: 300px;
left: 300px;
}
/*nimation-delay:1s*/
@keyframes arrow1{
0%{transform: translateY(0);}
100%{transform: translateY(10px);}
}

@-webkit-keyframes arrow1{
0%{-webkit-transform: translateY(0);}
100%{-webkit-transform: translateY(10px);}
}

.arrow{
animation: arrow1 2s infinite;
-webkit-animation: arrow1 2s infinite;
animation-timing-function:ease-in-out;
-webkit-animation-timing-function:ease-in-out;

-webkit-animation-direction:alternate;
animation-direction:alternate;
}
</style>
</head>
<body>
<div class="arrow">
<img src="http://paas.mail.10086.cn/res/build/images/c04.png" />
</div>
</body>
</html>
　　

链接

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航