在網站設計中，倒轉圖片是一種常見的效果。在CSS3中，通過使用transform屬性和rotate()函數，可以非常容易地實現這種效果。

假設我們有一個簡單的HTML結構：

<div class="flip-image">
<img src="image.jpg" alt="Flip Image">
</div>

我們給這個div設置了一個類名“flip-image”，并在里面放了一個img標簽。接下來，我們通過CSS3使用transform屬性和rotate()函數來翻轉這張圖片：

.flip-image:hover img {
-webkit-transform: rotateY(180deg);
transform: rotateY(180deg);
}

在這里，我們使用了:hover偽類，表示鼠標滑過時觸發效果。我們把transform屬性和rotate()函數應用到了img標簽，通過rotateY函數加上180度的旋轉角度，使圖片水平翻轉。同時，我們也使用了-vendor前綴“-webkit-”，以提高瀏覽器兼容性。

最終，我們就可以通過鼠標移動來讓圖片倒轉了。更多CSS3的transform屬性細節，請參考官方文檔。