这是一个实验中的功能
此功能某些浏览器尚在开发中,请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀.由于该功能对应的标准文档可能被重新修订,所以在未来版本的浏览器中该功能的语法和行为可能随之改变.
概述
animation-duration属性指定一个动画周期的时长。
默认值为0s，表示无动画。
使用简写属性animation很方便地同时设置所有的动画属性。
- 初始值
0s - 适用元素 all elements,
::beforeand::afterpseudo-elements - 可继承 no
- 适用媒体
visual - 计算值 as specified
- 可动画 否
- Canonical order the unique non-ambiguous order defined by the formal grammar
语法
Formal syntax: <time>#
animation-duration: 6s animation-duration: 120ms animation-duration: 1s, 15s animation-duration: 10s, 30s, 230ms
值
-
<time> - 一个动画周期的时长，单位为秒(s)或者毫秒(ms)，无单位值无效。
注意：负值无效，浏览器会忽略该声明，但是一些早起的带前缀的声明会将负值当作0s。
示例
See CSS animations for examples.
标准
| Specification | Status | Comment |
|---|---|---|
| CSS Animations | Working Draft |
浏览器兼容
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| Basic support | 3.0-webkit | 5.0 (5.0)-moz 16.0 (16.0) |
10 | 12-o 12.10 # |
4.0-webkit |
| Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | 2.0-webkit | 5.0 (5.0)-moz 16.0 (16.0) |
Not supported | Not supported | 4.2-webkit |
See also
- Using CSS animations
AnimationEvent- Animation-related CSS properties and at-rules:
animation,animation-delay,animation-direction,animation-duration,animation-fill-mode,animation-iteration-count,animation-name,animation-play-state,animation-timing-function,@keyframes