CSS中添加动画效果是一种很有趣的设计方式。下面就让我们一起来了解一下在CSS中添加动画效果的方法。首先,我们需要在CSS文件中添加一个@keyframes声明,该声明用来描述动画效果的过渡状态。@k
@keyframes example { from {background-color: red;} to {background-color: yellow;} }
.example { animation-name: example; animation-duration: 4s; /*动画时长*/ animation-timing-function: linear; /*动画过渡方式*/ animation-delay: 2s; /*动画延迟播放时间*/ animation-iteration-count: infinite; /*动画重复播放次数*/ }
.example { transition: background-color 1s linear; } .example:hover { background-color: red /*鼠标悬浮时触发颜色过渡*/ }
粉丝
0
关注
0
收藏
0