楠槡

CSS 动画 Cheat Sheet

2018-03-19

CSS 动画

CSS 动画一共有如下三种:

  • CSS Transition 平滑的改变CSS的值
  • CSS Animation 适用于CSS2,CSS3
  • CSS Transforms 变换主要实现(拉伸,压缩,旋转,偏移)

下面依次介绍一下:

CSS Transition

基本运用

在CSS 3引入Transition(过渡)这个概念之前,CSS是没有时间轴的。也就是说,所有的状态变化,都是即时完成。

例如:

当鼠标放置在粉色的div上时,原本瞬间放大的div会在1s内慢慢放大。

前往jsfiddle查看

使用支付宝打赏
使用微信打赏

若你觉得我的文章对您有帮助,点击上方按钮请我喝杯咖啡☕

若文章中存在问题,或您有任何意见和疑问,均可与我联系

扫描二维码,分享此文章 📱