Fade Out Directional (方向淡出)

元素滑出容器边缘后消失。

在[应用位置]添加“滑出”(Slide Out)退场动画，也叫 slide out up 或 slide out down。
元素保持完全不透明，滑出容器边缘后消失：快速，离开时加速。
在容器边缘处裁切，移出视野后对键盘和屏幕阅读器也隐藏；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则立即隐藏。

元素从一侧移动一小段距离到最终位置，同时淡入。

在[应用位置]添加“方向淡入”(Fade In Directional)入场动画，也叫 fade in left、fade in right 或 fade in down。
元素从一侧移动一小段距离到最终位置，同时淡入：迅速流畅，到位时减速，不要弹跳。
只播放一次；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接在原位显示，不做动画。

元素在淡出或滑出的同时逐渐变模糊。

在[应用位置]添加“模糊退出”(Blur Out)退场动画，也叫 text blur out 或 smoky text dissipate。
内容在原地越来越模糊并逐渐淡出：柔和、偏慢，仿佛消散一般。
等模糊效果结束后再隐藏或移除元素；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则立即隐藏。

元素缩小并滑向一侧边缘，同时淡出。

在[应用位置]添加“回弹退出”(Back Out)退场动画。
元素先在原地稍微缩小，再滑向一侧边缘并淡出：一个刻意的两段式退场，而不是一次快速淡出。
等动画结束后再移除元素，避免布局在动画中途跳动；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则立即移除。

元素在淡入的同时向上移动一小段距离，仿佛落到自己的位置上。

在[应用位置]添加“上浮淡入”(Fade Up)入场动画，也叫 fade-in-up 或滚动显现(reveal on scroll)。
元素第一次滚动进入视口时，一边轻微上移一边淡入：要含蓄、迅速，不要有弹跳感。
只播放一次；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接显示，不做动画。

元素像故障的霓虹灯一样快速闪烁几下，然后保持可见。

在[应用位置]添加“频闪进入”(Flicker In)入场动画。
元素像故障的霓虹灯一样，以不规则的间隔亮灭几次后保持点亮：干脆的闪烁，没有位移。
只播放一次，闪烁次数要少、速度不能太快，确保对光敏感的人也安全；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接以常亮状态显示。

元素绕 Y 轴旋转一整圈，同时稍微靠近观看者再退回。

在[应用位置]添加“翻转”(Flip)动画。
元素绕竖直轴旋转一整圈，同时稍微靠近观看者，然后尺寸微微一缩再回到原位：活泼但简短。
加上透视(perspective)让旋转有纵深感，只播放一次、不要循环；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则省略旋转。