水平翻轉也是一種常用的CSS效果。這種效果可以讓元素在水平方向上翻轉，常常用于制作卡牌、輪播圖等視覺效果。

/* CSS代碼 */
.flip {
transform-style: preserve-3d; /* 保持 3D 效果 */
transition: transform .5s; /* 添加過渡動畫 */
}
.flip:hover {
transform: rotateY(180deg); /* 水平翻轉180度 */
}

在CSS中使用transform屬性來創建翻轉效果，其中rotateY函數用于控制元素在Y軸上的旋轉角度，使得元素在水平方向上翻轉180度。hover偽類則是在鼠標懸停時觸發翻轉動畫。

此外，為了保持3D效果，還需要使用transform-style:preserve-3D的屬性值，否則元素只會在2D平面上進行旋轉，無法達到翻轉的效果。

總之，水平翻轉是一種常用的CSS效果，使用簡單而又實用，在網頁設計中應用廣泛。