###backdrop-filter
设置图片的高斯模糊 backdrop-filter: blur()
注意:运用backdrop-filter元素的背景应该使用半透明,不然看不到效果
和裁剪属性如border-radius一起使用时会有bug产生
可以配合动画属性animation一起使用
###transform-origin
设置旋转元素的基点 可以设三个值,xyz轴
可能的值有:x轴 => left right center length %
y轴 => top bottom center length %
z轴 => length
####暂停动画
animation-play-state:paused;
transition
他有4个属性 动画名 时间 速度曲线 动画开始的延迟
transition一般用于简单的hover事件
animation
是css的动画 ,有6个属性, keyframe名称,时间毫秒,动画的速度曲线,动画开始的延迟,
动画的播放次数,规定是否反应该轮流反向播放动画(alternate 动画应该轮流反向播放)
animation一进页面就会执行
css3 animation 动画定义了不同时间的位置,因为是作用在 cdWrapper 上的,一开始要把它偏移到左下方,并且把它缩小,60% 的时候然后再偏移到它最终的位置,但是 scale 变大,100% 的时候恢复到它最终的样子。
forwards : 完成动画时,保存最后一帧css的样式
touch-action 用于指定某个给定的区域是否允许用户操作,以及如何响应用户操作(比如浏览器再带的滑动,缩放等)
- { touch-action: none; } 当触控事件发生在元素上时,不进行任何操作。