【年度盛宴】2012年排名前20位的 CSS 網站做品

　　2012年涌現出衆多獨特的，使人印象深入的 CSS 網站做品，要從中挑選出年度應用 CSS 的最佳網站列表一個嚴峻的挑戰，由於 CSS 涵蓋了媒體查詢（CSS3 Media Queries）、CSS 動畫和3D轉換等衆多特性。我根據過去 CSS 典型的應用場景挑選了其中的優秀做品組成一個列表，若是你有收藏更好的做品，歡迎留言向你們分享。

1. Beercamp

這個啤酒節的活動網站充分應用了 3D CSS Transform 技術，充滿立體感的旋轉和摺疊效果。

2. Spelltower

Spelltower 不只是一個使人上癮的遊戲，它也有一個網站，充滿樂趣和個性。

使用的俏皮動畫和過渡效果，讓你想抓住一個 iPhone 並啓動遊戲。

3. Envy Labs

Envy Labs 的其中一個標語是「咱們創造的樂趣」。採用CSS3 Transform 和 Transition 呈現一個頗有趣的旋轉***！

4. Fine Goods

這個可愛的網站組合使用各類 CSS 屬性實現個性的設計。價格標籤會旋轉變換和動畫，抽屜形式的導航個性十足，甚至會讓你大吃一驚。

5. Mammoth Booth

微妙的動畫，外加一些打孔的插圖，轉換和邊框陰影讓圖片帶給人們真實照片的感受。

6. Postable

由 Kevin Kneifel 開發的 Web 應用程序，充滿特點。聰明的懸停和過渡相結合，有趣插圖讓網站可以吸引用戶。

7. Lift Interactive

這個網站在互動方面作了很是了不得的工做，保持良好的設計和使用各類效果兼顧得很好。

我最喜歡的是書本上的3D轉換效果，鼠標懸停的時候增添了一絲的驚喜。

8. Impress a Penguin

很可愛的企鵝，創新的設計帶給用戶良好的故事閱讀體驗。

9. Microsoft

Paravel 爲微軟設計了一個全新的主頁，這個網站最大的特點在於響應式設計。

10. Stuff & Nonsense

這個太搞了，極具創意的響應式設計！縮小瀏覽器窗口瀏覽試試，有驚喜哦！

11. Hammer

使用了讓人耳目一新的鼠標懸停過渡效果，和圖片傳送帶造成互動。

12. Lab Partners

精心策劃的佈局，使用非典型的旋圖片傳送帶效果。

該網站是用於時尚藝術與設計工做室的，經過他們所選擇的顏色和對細節的關注向訪客傳達了一個強烈的信息。

13. Always Creative

總部設在休斯頓的一個創意機構的網站，他們添加了一點點的變焦旋轉效果以及不少微妙的動畫。

14. Chartbeat

讓你在其網站上從選擇顏色和類型開始，微妙的觸摸動畫和轉換，滾動的產品描述可以讓你充滿好奇。

15. OPower UX

這個創意的網頁顯示出一個充滿個性的團隊，使用各類時尚的元素和簡單的圖標頁面告訴你其團隊成員信息。

16. Circles Conference

使用各類形式的圓形元素技巧，加入強力的配色，體現了會議的相關的各類信息的網站，讓人充滿期待。

17. Two Paperdolls

這個優雅的網站在首頁提供了兩個入口途徑，在鼠標懸停的時候給圖像着色（默認是灰白風格）。

18. Jukely

這是網頁只是一個即將發佈的服務的着陸頁（Landing Page），但它頗有特點。

爲每一個元素設置的動畫和漸變頁面背景融合在一塊兒，讓人訂閱的時候充滿了驚奇和喜悅。

19. Station Four

有趣的導航設計，它採用大圓形形象的呈現主要連接。導航使用雙層圓環設計，並增長了一些熱點動畫。

20. United Pixelworkers

這個網站今年進行了兩個版本的更新，使用了奇妙的響應佈局和頁面排版，讓你挑選襯衫的過程充滿樂趣。

  

您可能感興趣的相關文章

 

• 分享35個很是漂亮的單頁網站設計案例
• 10套精美的免費網站後臺管理系統模板
  
• 25個國外優秀的餐飲網站設計案例欣賞
• 25個國外優秀的電子商務網站設計案例
• 12個優秀的 HTML5 網站設計案例欣賞

 

本文連接：年度盛宴：2012年排名前20位的 CSS 網站做品

編譯來源：夢想天空 ◆ 關注前端開發技術 ◆ 分享網頁設計資源