Photoshop精細制作Vista風(fēng)格網(wǎng)站導(dǎo)航條

來源:不詳 作者:佚名 學(xué)習(xí):804人次
發(fā)表于 2007-8-30 08:58 Photoshop精細制作Vista風(fēng)格網(wǎng)站導(dǎo)航條作者:閃電兒 來源:網(wǎng)頁教學(xué)網(wǎng) PS教程論壇:http://bbs.16xx8.com

利用Photoshop制作Vista風(fēng)格網(wǎng)站導(dǎo)航條,效果還算可以。

新建立文件500px * 50px,制作480px * 30px的一個選區(qū)。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

執(zhí)行“選擇”-> “修改” -> “平滑”,設(shè)置半徑為 2px。效果如下。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

創(chuàng)建一個新圖層,填充選擇為任何顏色。

應(yīng)用圖層樣式。漸變顏色為 #313332 到 #46474a

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

描邊顏色為 #676767。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

選擇上面的部分。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

新建立一圖層,從上到下用白色到透明進行漸變填充。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

圖層模式改為線性減淡,不透明度35%。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

效果如下。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

再建新圖層,使用單行選框工具在上部選擇1px區(qū)域。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

填充為白色。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

按Ctrl單擊最下面的圖層

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

執(zhí)行“選擇” -> “反選”,按Del。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

改變圖層混合模式為柔光,不透明度為60%。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

下面添加一些字符。創(chuàng)建一 130px * 24px 選區(qū),然后“選擇” -> “修改” -> “平滑”,設(shè)置半徑為2px。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

建立新圖層,任意顏色填充選區(qū),添加圖層樣式,漸變設(shè)置 #000000 到 #2f3233。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

描邊設(shè)置 #0f1011 到 #575858。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

創(chuàng)建新層,然后按Ctrl單擊圖層,執(zhí)行“編輯” -> “描邊”設(shè)置如下。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

圖層不透明度設(shè)置為15%。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

選擇一半創(chuàng)建新圖層填充顏色,然后從上到下應(yīng)用白色到透明的漸變效果。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

不透明度設(shè)置為80%。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

添加字符,字體為Verdana 字號11pt,白色。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

我們在文字中間添加分隔線.創(chuàng)建新層,使用單列選框工具選擇區(qū)域,填充顏色為#1a1b1c,向右移動選區(qū)1px再次填充為#5d5f60再向右移動1px填充為#232526

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

用20px柔筆刷擦除上下的部分,圖層不透明度設(shè)置為50%

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

復(fù)制該圖層移動到下一個位置.

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

最終效果如下。

Photoshop精細繪制Vista風(fēng)格網(wǎng)站導(dǎo)航條

學(xué)習(xí) · 提示

  • 一定要打開PS,跟著教程做一遍,做完的圖到這交作業(yè):提交作業(yè)
  • 建議練習(xí)時,大家自己找素材,盡量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到論壇發(fā)帖提問:新手求助
  • 加官方微信,隨時隨地,想學(xué)就能學(xué):ps_bbs,或掃右側(cè)二維碼!
  • 關(guān)注我們學(xué)更多,每天都有新教程:新浪微博 抖音視頻 微信小程序
- 發(fā)評論 | 交作業(yè) -
最新評論
暫無評論,交個作業(yè)支持一下吧~

關(guān)注大神微博加入>>

網(wǎng)友求助,請回答!