CSS可以為圖片添加各種動(dòng)畫效果，包括翻轉(zhuǎn)動(dòng)畫。以下代碼示例可以幫助您快速實(shí)現(xiàn)這種效果：

/* 定義一個(gè)包含翻轉(zhuǎn)動(dòng)畫的類 */
.flip {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
transition: 0.5s;
}
/* 定義正面和反面的樣式 */
.flip .front,
.flip .back {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* 隱藏反面 */
.flip .back {
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
transform: rotateY(180deg);
}
/* 定義鼠標(biāo)懸停時(shí)的效果 */
.flip:hover {
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
transform: rotateY(180deg);
}

使用以上代碼，您可以定義一個(gè)包含翻轉(zhuǎn)動(dòng)畫的類名為"flip"，并將它應(yīng)用于一個(gè)包含正面和反面的容器元素上。正面和反面內(nèi)容可以通過添加"front"和"back"類來實(shí)現(xiàn)。當(dāng)鼠標(biāo)懸停于容器元素上時(shí)，將會(huì)展現(xiàn)出翻轉(zhuǎn)效果。如果您需要更復(fù)雜的翻轉(zhuǎn)效果，可以通過CSS動(dòng)畫或JavaScript實(shí)現(xiàn)。請(qǐng)注意，此效果只適用于支持3D變換的瀏覽器。