X 轴翻入
从背面翻转到正面并淡入。
效果预览
参数调节
完整代码
/* X 轴翻入 */
@keyframes flipInX {
from { opacity: 0; transform: perspective(600px) rotateX(-90deg); }
to { opacity: 1; transform: perspective(600px) rotateX(0); }
}
.flip-in-x { animation: flipInX .7s ease-out both; }