X 轴翻转
绕水平轴翻转 180 度,需要透视才有立体感。
效果预览
参数调节
完整代码
/* X 轴翻转 */
@keyframes flipX {
from { transform: perspective(600px) rotateX(0); }
to { transform: perspective(600px) rotateX(180deg); }
}
.flip-x { animation: flipX .7s ease-in-out both; }