css3动画如何在动作结束时保持该状态不变

如题所述

animation-fill-mode : none | forwards | backwards | both;

none:不改变默认行为。    

forwards :当动画完成后,保持最后一个属性值(在最后一个关键帧中定义)。    

backwards:在 animation-delay 所指定的一段时间内,在动画显示之前,应用开始属性值(在第一个关键帧中定义)。    

both:向前和向后填充模式都被应用。  

扩展资料:

CSS3是CSS(层叠样式表)技术的升级版本,于1999年开始制订,2001年5月23日W3C完成了CSS3的工作草案,主要包括盒子模型、列表模块、超链接方式、语言模块、背景和边框、文字特效、多栏布局等模块   。

CSS演进的一个主要变化就是W3C决定将CSS3分成一系列模块。浏览器厂商按CSS节奏快速创新,因此通过采用模块方法,CSS3规范里的元素能以不同速度向前发展,因为不同的浏览器厂商只支持给定特性。但不同浏览器在不同时问支持不同特性,这也让跨浏览器开发变得复杂。

参考资料:百度百科-CSS3



温馨提示:内容为网友见解,仅供参考
第1个回答  推荐于2017-09-16
animation-fill-mode : none | forwards | backwards | both;

none:不改变默认行为。    

forwards :当动画完成后,保持最后一个属性值(在最后一个关键帧中定义)。    

backwards:在 animation-delay 所指定的一段时间内,在动画显示之前,应用开始属性值(在第一个关键帧中定义)。    

both:向前和向后填充模式都被应用。    

本回答被提问者和网友采纳
第2个回答  2014-10-16
@keyframes定义,把默认属性和100%的属性写一样
第3个回答  2014-10-18
了解一下 animation-fill-mode。
第4个回答  2014-10-16
动画执行的次数限定
相似回答