CSS3是前端開發中使用廣泛的語言之一，它不僅可以控制網頁中的布局、字體、顏色等，還可以實現很多有趣的特效，比如圖片的擺動效果。下面我們來看一下如何用CSS3實現圖片的擺動。

<p class="swing">
<img src="example.jpg">
</p>
.swing {
animation: swing 2s ease-in-out infinite;
transform-origin: center;
}
@keyframes swing { 
0% { transform: rotate(0deg); }
50% { transform: rotate(30deg); }
100% { transform: rotate(0deg); }
}

以上是一個簡單的CSS3圖片擺動的示例，首先我們在HTML中添加了一個img標簽，并為其父元素的p標簽添加了一個名為"swing"的class，來便于后面的樣式控制。接著我們在CSS中定義了一個名為"swing"的動畫（@keyframes），并將其應用于".swing"類。在動畫中通過不同的transform屬性值來實現了圖片的擺動，其中"transform-origin"指定了旋轉中心為圖片的中心點，"animation"設置了動畫的時間（2s）、easing函數（ease-in-out）和循環次數（infinite）。

要實現不同的擺動效果，只需調整@keyframes中的transform屬性值即可。

總之，CSS3的強大功能讓我們可以輕松實現各種有趣的特效，圖片的擺動只是其中的一種。希望這篇文章對你有所幫助！