一个浮动 css3效果

Posted you1you

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了一个浮动 css3效果相关的知识,希望对你有一定的参考价值。


<!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>

  

链接

以上是关于一个浮动 css3效果的主要内容,如果未能解决你的问题,请参考以下文章

在列表视图前浮动一个按钮

浮动 div 的 CSS3 动画布局更改

CSS3秘笈复习:十三章&十四章&十五章&十六章&十七章

Css3之基础-8 Css 浮动(定位,浮动定位)

js 手风琴菜单折叠要用到列表浮动吗

十条jQuery代码片段助力Web开发效率提升