CSS/CSS3

基础入门

高级进阶

参考手册

实战案例

CSS 动画

2017-08-15 14:30:27 来源: 点击:站内收藏

定义和用法

一些 CSS 属性是可以有动画效果的,这意味着它们可以用于动画和过渡。

动画属性可以逐渐地从一个值变化到另一个值,比如尺寸大小、数量、百分比和颜色。

浏览器支持

表格中的数字表示支持该方法的第一个浏览器的版本号。

紧跟在数字后面的 -webkit-, -moz-, 或 -o- 指定了第一个支持该属性的浏览器版本前缀。

Chrome
IE Firefox Safari Opera
4.0 -webkit- 10.0 16.0
5.0 -moz-
4.0 -webkit- 15.0 -webkit-
12.1
12.0 -o-

实例

背景颜色逐渐地从红色变化到蓝色:

@keyframes mymove{
  from {background-color:red;}
  to {left:blue;}
}
/*Safari 和 Chrome:*/
@-webkit-keyframes mymove{
  from {background-color:red;}
  to {background-color:blue;}
}
相关热词搜索:
评论正在载入