定义和用法 一些 CSS 属性是 可以有动画效果的 ，这意味着它们可以用于动画和过渡。 动画属性可以逐渐地从一个值变化到另一个值，比如尺寸大小、数量、百分比和颜色。 浏览器支持
定义和用法
一些 CSS 属性是可以有动画效果的，这意味着它们可以用于动画和过渡。
动画属性可以逐渐地从一个值变化到另一个值，比如尺寸大小、数量、百分比和颜色。
浏览器支持
表格中的数字表示支持该方法的第一个浏览器的版本号。
紧跟在数字后面的 -webkit-, -moz-, 或 -o- 指定了第一个支持该属性的浏览器版本前缀。
|
|
|
|
|
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 {background-color:blue;}
}
@-webkit-keyframes mymove
{
from {background-color:red;}
to {background-color:blue;}
}
尝试一下 »
动画属性
CSS 中的动画属性：
属性 |
实例 |
background尝试一下 》
background-color尝试一下 》
background-position尝试一下 》
background-size尝试一下 》
border尝试一下 》
border-bottom尝试一下 》
border-bottom-color尝试一下 》
border-bottom-left-radius尝试一下 》
border-bottom-right-radius尝试一下 》
border-bottom-width尝试一下 》
border-color尝试一下 》
border-left尝试一下 》
border-left-color尝试一下 》
border-left-width尝试一下 》
border-right尝试一下 》
border-right-color尝试一下 》
border-right-width尝试一下 》
border-spacing尝试一下 》
border-top尝试一下 》
border-top-color尝试一下 》
border-top-left-radius尝试一下 》
border-top-right-radius尝试一下 》
border-top-width尝试一下 》
bottom尝试一下 》
box-shadow尝试一下 》
clip尝试一下 》
color尝试一下 》
column-count尝试一下 》
column-gap尝试一下 》
column-rule尝试一下 》
column-rule-color尝试一下 》
column-rule-width尝试一下 》
column-width尝试一下 》
columns尝试一下 》
filter尝试一下 》
flex
flex-basis尝试一下 》
flex-grow尝试一下 》
flex-shrink尝试一下 》
font尝试一下 》
font-size尝试一下 》
font-size-adjust
font-stretch
font-weight尝试一下 》
height尝试一下 》
left尝试一下 》
letter-spacing尝试一下 》
line-height尝试一下 》
margin尝试一下 》
margin-bottom尝试一下 》
margin-left尝试一下 》
margin-right尝试一下 》
margin-top尝试一下 》
max-height尝试一下 》
max-width尝试一下 》
min-height尝试一下 》
min-width尝试一下 》
opacity尝试一下 》
order尝试一下 》
outline尝试一下 》
outline-color尝试一下 》
outline-offset尝试一下 》
outline-width尝试一下 》
padding尝试一下 》
padding-bottom尝试一下 》
padding-left尝试一下 》
padding-right尝试一下 》
padding-top尝试一下 》
perspective尝试一下 》
perspective-origin尝试一下 》
right尝试一下 》
text-decoration-color尝试一下 》
text-indent尝试一下 》
text-shadow尝试一下 》
top尝试一下 》
transform尝试一下 》
transform-origin尝试一下 》
vertical-align尝试一下 》
visibility
width尝试一下 》
word-spacing尝试一下 》
z-index尝试一下 》
