Photoshop繪制好看的Win7風(fēng)格網(wǎng)站導(dǎo)航

2022-12-26 14:42:07 來源/作者: / 己有:12人學(xué)習(xí)過
作者:佚名 出處:woaicss

做了一個Windows 7風(fēng)格的導(dǎo)航菜單。下面是簡單的制作步驟。



制作背景

(1)新建一文件,大小自定,這里是600*400為例。設(shè)置前景色:#1592d7,背景顏色:#136da2,

選擇徑向漸變工具。從中間拖動得到下面效果:

(2)添加散射光條文。新建一層,左邊工具欄選擇-圓角矩形按鈕-自定義形狀按鈕。找到下面這個形狀,如果沒有可以點擊右邊的小箭頭,追加形狀。

選中并在圖層上拖動得到如下效果:

前景色設(shè)為白色(#ffffff),選擇鋼筆工具,右擊路徑--填充路徑。得到下圖:

右擊路徑--刪除路徑。選擇“濾鏡”-模糊-高斯模糊-5個像素。單擊確定。圖層混合模式改為“柔光”。不透明度為30%。

添加Windows 7字樣及l(fā)ogo。



制作導(dǎo)航背景

(1)新建一圖層命名為“nav”。拖出一個黑色矩形框。高度根據(jù)自己需要。

填充改為:10%。新建一圖層,制作邊線。畫兩根1px線,上邊一根黑色,透明度50%,下面一根白色。

復(fù)制頂線,移動至底部:

制作導(dǎo)航按鈕

(1)新建圖層,做出如下選區(qū),注意上下邊緣:

填充黑色,不透明設(shè)為“0”,描邊:

(2)復(fù)制上面的圖層,清除圖層樣式,添加如下樣式:

 

 

漸變疊加,顏色由白色 到透明。描邊:

得到如下:

制作右下角高光邊框:

添加圖層蒙版,前景黑色背景白色。拖動得到如下效果:

最終:

標(biāo)簽(TAG) 網(wǎng)頁圖片