CSS3中的動畫效果可以為網頁增添趣味和活力，其中最受歡迎的效果之一就是隨風飄動的動畫效果。

通過以下CSS代碼，我們可以為網頁元素添加隨風飄動的效果。

.float {
animation: float 2s ease-in-out infinite;
transform-origin: center;
}
@keyframes float {
0% {
transform: translatey(0px);
}
50% {
transform: translatey(-20px);
}
100% {
transform: translatey(0px);
}
}

在上面的代碼中，我們使用了CSS3的animation屬性，為元素添加了float動畫，持續時間是2秒鐘，動畫效果緩慢出現和消失，重復無限次。我們同時還通過transform-origin屬性將變換的中心點設置為中心。

接下來，我們通過關鍵幀動畫（@keyframes）來實現隨風飄動的效果。在動畫開始時（0%），元素不做任何變換，隨后在50%時，元素向上移動20px，最后回到初始位置（100%）。

最后，在HTML中寫入以下代碼，為元素添加類名float即可啟用這個效果。

<div class="float">隨風飄動的元素</div>

現在，你的網頁元素已經實現了隨風飄動的動畫效果，感受一下這個效果給網頁帶來的活力吧！