跳到主要内容

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; }