css3动画倒着播 |freemaker设置css样式

.animation {
animation: example 5s forwards;
}
.animation.reverse {
animation-direction: reverse;
}
@keyframes example {
from {opacity: 0;}
to {opacity: 1;}
}

要实现倒着播放 CSS3 动画，大家可以使用 animation-direction 属性来指定动画播放的方向。默认属性值是 normal，表示动画正常播放，而 reverse 则表示倒着播放。

在大家的代码示例中，大家首先定义了一个名为 animation 的 class，其中的 animation 属性会让动画按照大家的需求播放，而 .reverse 则会让动画倒着播放，这样动画就可以变得更加生动有趣了。

接着大家定义了一个 @keyframes 规则集，使用 from 和 to 来规定动画开始和结束时的状态改变，这样浏览器就能正确生成动画了。

以上就是关于 CSS3 动画倒着播放的相关内容了，大家可以借此掌握更多有关 CSS3 动画的知识，让大家的网页更加生动有趣。