在CSS中，我們可以使用animation和@keyframes屬性來創(chuàng)建動(dòng)畫效果。其中，使用@keyframes定義關(guān)鍵幀，在animation中引用關(guān)鍵幀來調(diào)用動(dòng)畫。

在下面的代碼示例中，我們將展示如何使用CSS動(dòng)畫輪流反方向。首先，我們定義了一個(gè)名為flip的關(guān)鍵幀，其中包含了兩個(gè)幀，分別是0% 和 100%。在這兩個(gè)幀中，我們分別定義了元素的transform：rotateY屬性的值，用來控制元素的翻轉(zhuǎn)方向。當(dāng)rotateY的值為0deg時(shí)，元素的正面朝向我們；當(dāng)值為180deg時(shí)，元素的背面朝向我們。

@keyframes flip {
0% {
transform: rotateY(0deg);
}
100% {
transform: rotateY(180deg);
}
}

接下來，我們將animation屬性應(yīng)用到元素上，來調(diào)用flip關(guān)鍵幀。在這里，我們使用了animation-duration、animation-timing-function、animation-fill-mode等屬性來配置動(dòng)畫表現(xiàn)。animation-direction屬性指定了元素翻轉(zhuǎn)時(shí)的方向，alternate-reverse則使得元素輪流反向翻轉(zhuǎn)。

.flip-animation {
animation: flip 2s ease-in-out both alternate-reverse;
}

完整代碼如下：

@keyframes flip {
0% {
transform: rotateY(0deg);
}
100% {
transform: rotateY(180deg);
}
}
.flip-animation {
animation: flip 2s ease-in-out both alternate-reverse;
}

最后，我們只需要將.flip-animation應(yīng)用到我們需要翻轉(zhuǎn)的元素上即可。