【原文地址】：http://coolshell.cn/?p=562
我想，大家在上網的時候一定見過很多很多種各式各樣的網站導航條的設計。這些導航條基本上來說都是用CSS來做的。這裡，我們將向你介紹幾種最不錯的用CSS設計的網站導航條。希望你會喜歡。
1. The Menu menu
這是一個非常不錯的CSS選單，相當的獨特，每個圖示都有滑鼠感應，然後出現子選單。如果你想知道怎麼做的，你可以簡單的看一下這個網頁的原始碼。
2. Pure CSS hover menu
一個縱向顯示的滑鼠感應的選單和其子選單。
3. Matte CSS Menu
Matte 是一個簡單的CSS 選單，使用兩個圖片，可以有13種風格。這個CSS選單由 David Appleyard 開發和維護，他開發了很多很多簡單而有強大的CSS選單。
4. CSS Blur Menu
一個模糊的導航條，只有當滑鼠經過的時候才會變得清楚。
5. CSS Navigation with Glowing Icons
有一個非常不錯的簡單的教程會教你建立這個漂亮的CSS導航條。
6. CSS Sliding Door using only 1 image
這是一個樸素的CSS導航條，其基於 Sliding Doors 技術，只需要一個圖片。
7. Navigation Matrix Reloaded
又一個相當時髦的導航條。
8. CSS Horizontal Menu
Ian Main 提供了一組很不錯的相當時髦的CSS導航條。
9. Woody CSS Menu
Woody 是一個跨瀏覽器的CSS導航條，其在IE6, IE 7, Firefox, Opera, Safari, Chrome上測試通過。
10. Advanced CSS Menu
Advanced CSS Menu 由Nick La 開發，其使用了一個相當獨特的方式。
這個導航條由CSS Menu Generator 生成。這是一個質量很不錯的導航條。
12. Vimeo-Like Top Navigation
這個基於CSS的導航條由 Vimeo 製作。
13. Apple Like Colorful CSS Menu
這是一個效仿 Apple的圖片滾動的CSS選單，其有一個教程。
14. CSS Hoverbox
其靈感來源於 Hoverbox Image Gallery，由Nathan Smith開發，CSS Hoverbox 使用background-position CSS 屬性製作。網頁上有教程。
15. Big CSS Box
這只不過是一個試驗性質的CSS 導航條，其允許你建立一個可以縮放的導航條，其可以自適應於瀏覽器的寬度。
16. Simple CSS-based drop-down menu
這個下拉式選單，雖然非常簡單，但是卻非常的優秀。
17. Two Level Horizontal Navigation in CSS
Veerle Pieters 提供的這個CSS導航條教程，其主要使用了text-indent CSS 屬性。
18. Uberlink CSS List Menus
這個CSS導航條看起來很像是一個圖片切換的樣子。
19. CSS-Only Accordion Effect
這個CSS設計的很有想法，啥也不說了，上去看看就知道有多酷了。
20. Tabbed Navigation Using CSS
這是另一個很不錯的相法，讓你可以建立一個TAB頁，注意這是完全由純CSS寫成的。你可以通過點選上面的連結檢視如何製作這樣一個介面。
21. CSS Mini Tabs (the UN-tab, tab)
這個CSS導航條是由一個比較流行的網頁設計中介 SimpleBits 完成，它展示了一個可以建立小TAB頁的方法。
22. Drop-Down Menus, Horizontal Style
這個A List Apart CSS 選單技術主要實現了一個縱向的二級選單，其主要使用了 position: absolute CSS 屬性來決定了選單的位置。
23. List Into a Navigation Bar
Roger Johansson 的456 Berea Street 展示了一個簡單的理論——把一些帶有下劃線的列表轉換成了一個導航條。這是一個非常好的給初學者的一個案例，可以通過它學習到如何通過CSS建立一個HTML結構的導航條。
24. CSS Tabs with Submenus
這個CSS導航條選單允許你建立二級的TAB頁，相當不錯哦。
25. CSS Block Navigation Menu
這個CSS導航條，讓你可以建立一個帶有描述語的導航條。
26. XHTML & CSS Sprite Navigation
這個時尚的CSS精靈導航條有三個狀態：空閒，滑鼠感應，和滑鼠點選。
27. XHTML CSS Tabbed Menu
你可以學習一個如果不用指令碼來建立TAB頁。
28. Cool, Simple, Horizontal CSS Menu
教你如果建立一個簡單直接的CSS導航條。
29. CSS Menu with Descriptions
一個會擴充套件的導航條。
30. CSS Hover Button
一個相當不錯的教程教你如果制一個滑鼠感應式的按鈕。