想在您的網站上添加一款酷黑的導航條嗎？這篇教程將教您快速而有效的制作一款導航條并添加到您的網站中。

先預覽下最終效果吧！很酷哦！

第一步：基本要領

創建新的psd文檔，寬度700px，高度160px，背景色以黑灰色（#2b2b2b）填充。

新建圖層，圖層屬性為“導航條”，選擇圓角矩形工具，設置前景色為黑色（#000000）如下圖一樣畫一矩形條（長度和寬度可自行處理）。

第二步：設置圖層樣式

雙擊“導航條”圖層或者選擇“導航條”圖層，點擊右鍵，在下拉菜單中選擇混合選項菜單，將出現“圖層樣式對話框”。

點擊左邊復選框中的“外發光”，并且如下圖進行設置：

再點擊左邊復選框中的“斜面和浮雕”，并且如下圖進行設置：

最后，點擊左邊復選框中的“漸變疊加”，如下圖進行設置：

完成以上步驟后，你的導航條將會是這個樣子：

第三步：增加高光

新建圖層，設置前景色為白色（#ffffff），選擇矩形工具，用白色矩形條覆蓋導航條的上半部，選擇橡皮擦工具擦去左上角和右上角的白色，顯示導航條的圓角形狀，如下圖所示：

把此圖層的透明度降低為4%，導航條將會如下圖所示：

第四步：制造發光

新建圖層，設置前景色為#2a5368。

從畫筆工具中選擇預設畫筆，并設置大小為360px。使用畫筆，在導航條上方中心畫一個圓形區域，設置圖層透明度為65%（自己可斟酌減少或增加），選擇橡皮擦工具擦去不屬于導航條的發光區域，如下圖所示：

剩下要做的就是添加菜單按鈕（自行設計），使用白色或灰色即可。

完整的導航條華麗麗的出爐了：

但愿你喜歡！