使用 CSS 设置动画完成一个周期所需的时间

ID:13726 / 打印

使用 css 设置动画完成一个周期所需的时间

使用animation-duration属性来设置动画完成一个循环所需的时间:

示例

在线演示

<!DOCTYPE html> <html>    <head>       <style>          div {             width: 150px;             height: 200px;             position: relative;             background: red;             animation-name: myanim;             animation-duration: 2s;          }          @keyframes myanim {             from {left: 0px; background-color: green;}             to {left: 200px; background-color: blue;}          }       </style>    </head>    <body>       <div> </div>    </body> </html>
上一篇: 使用 CSS 淡入左大动画效果
下一篇: 设置动画是向前播放还是使用 CSS

作者:admin @ 24资源网   2024-10-18

本站所有软件、源码、文章均有网友提供,如有侵权联系308410122@qq.com

与本文相关文章

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。