用CSS3制作很特别的波浪形菜單

網頁菜單我們見過很多，各種炫酷的、實用的菜單比比皆是。昨天我看到一款很特别的CSS3菜單，它的外形是波浪形的，彎彎曲曲，結合背景，看上去還挺不錯的，下面看下一效果圖。

我想說可能菜單并不是很實用，但是很有創意，而且也友善我們學習CSS3。

接下來我們來對這款波浪形菜單的源代碼簡單分析一下。

HTML代碼的結構非常簡單：

然後是CSS代碼，這裡我們對菜單項進行絕對定位

接着就是重點的波浪形效果的CSS代碼了，這裡主要利用了CSS3的transform動畫屬性，利用rotate進行旋轉，skewY進行y軸傾斜。

這裡說明一下nth-child(n)，它表示該父元素的第n個子元素。