CSS可以通過transform屬性來實(shí)現(xiàn)翻轉(zhuǎn)一張圖片的效果。使用transform屬性可以對元素進(jìn)行旋轉(zhuǎn)、縮放、平移和傾斜等操作，其中旋轉(zhuǎn)可以分為水平翻轉(zhuǎn)和垂直翻轉(zhuǎn)兩種，分別對應(yīng)X軸和Y軸的旋轉(zhuǎn)。

通過對元素設(shè)置transform屬性，可以使用scaleX(-1)來實(shí)現(xiàn)水平翻轉(zhuǎn)，使用scaleY(-1)來實(shí)現(xiàn)垂直翻轉(zhuǎn)。其中參數(shù)-1表示翻轉(zhuǎn)的方向，-1代表翻轉(zhuǎn)，1代表不翻轉(zhuǎn)。

img {
transform: scaleX(-1); /* 水平翻轉(zhuǎn) */
transform: scaleY(-1); /* 垂直翻轉(zhuǎn) */
}

使用transform屬性進(jìn)行翻轉(zhuǎn)圖片時(shí)，需要注意元素的定位和寬高，否則翻轉(zhuǎn)后的圖片可能會覆蓋其它元素。可以通過設(shè)置元素的position屬性來解決定位問題，設(shè)置元素的width和height屬性來解決寬高問題。

除了使用transform屬性翻轉(zhuǎn)圖片外，也可以使用CSS Sprites技術(shù)來實(shí)現(xiàn)翻轉(zhuǎn)效果。通過在一張圖片中預(yù)留不同方向的圖片，然后通過background-position屬性來控制顯示哪個(gè)方向的圖片來實(shí)現(xiàn)翻轉(zhuǎn)效果。但是使用CSS Sprites需要進(jìn)行圖片的拼接和計(jì)算坐標(biāo)位置，比較麻煩。

總結(jié)，通過transform屬性可以簡單地實(shí)現(xiàn)圖片的翻轉(zhuǎn)效果，同時(shí)還可以進(jìn)行其它操作。使用CSS Sprites需要進(jìn)行圖片的拼接和計(jì)算坐標(biāo)位置，不太方便，但是靈活性比較高。