[CSS3]CSS3应用animation(动画)的介绍与实例
[CSS3]CSS3应用animation(动画)的介绍与实例 使用简写属性把 animation 绑定到一个div 元素: div { animation:mymove5sinfinite; -webkit-animation:mymove5sinfinite;/*Safari和Chrome*/ } !DOCTYPEhtml html head meta charset = utf-8 title 菜鸟教程(
[CSS3]CSS3应用animation(动画)的介绍与实例
使用简写属性把 animation 绑定到一个<div> 元素:
- div
- {
- animation:mymove 5s infinite;
- -webkit-animation:mymove 5s infinite; /* Safari 和 Chrome */
- }
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>菜鸟教程(runoob.com)</title>
- <style>
- div
- {
- width:100px;
- height:100px;
- background:red;
- position:relative;
- animation:mymove 5s infinite;
- -webkit-animation:mymove 5s infinite; /*Safari and Chrome*/
- }
- @keyframes mymove
- {
- from {left:0px;}
- to {left:200px;}
- }
- @-webkit-keyframes mymove /*Safari and Chrome*/
- {
- from {left:0px;}
- to {left:200px;}
- }
- </style>
- </head>
- <body>
- <p><strong>注意: </strong> Internet Explorer 9 及更早IE版本不支持 animation 属性。</p>
- <div></div>
- </body>
- </html>
热门文章推荐
- 免费视频云存储
- 酷播云视频二维码生成器
- 免费无广告的视频云服务
- 免费视频二维码的使用指南(一看就会懂的二维码教程)
- 免费第三方网站上传视频平台
- 酷播云怎么生成二维码
- 多个视频怎么生成一个二维码?
- 企业视频上传,不要有广告,用什么好
请稍候...