當前位置:首頁>ps實例教程>ps網頁設計>按鈕圖標>教程內容

Photoshop輕松制作Apple網站導航條按鈕

來源:不詳 作者:佚名 學習:431人次
發(fā)表于 2007-9-8 10:27 Photoshop輕松制作Apple網站導航條按鈕作者:閃電兒 來源:網頁教學網 PS教程論壇:http://bbs.16xx8.com

Photoshop教程,利用Photoshop模擬制作Apple.Com蘋果網站的網站導航條按鈕。最終大家可以去http://www.apple.com網站對比下效果。
1.新建立一個500*50px的文檔,然后選擇矩形選框工具,設置模式為固定大小寬為 480px 高為 35px 繪制一個矩形選區(qū)。

2.現在,執(zhí)行“選擇” -> “修改” -> “平滑”在出現的對話框中設置為33px,創(chuàng)建一新圖層,把選區(qū)填充為任意顏色。

3.設置該圖層的圖層樣式:漸變疊加,#949494 - #d2d2d2進行漸變。

投影: #b1b1b1。

4.填寫一些字符,這里使用英文字符Segoe UI字體,顏色#383838,大小為14pt。

5.為文字添加投影樣式。

6.現在效果如下。

7.現在我們在文字之間添加分隔線。創(chuàng)建新圖層,使用鉛筆工具,繪制兩條線,使兩條線分開1px,顏色設置為白色。最后改變圖層模式為柔光,不透明度降低到20%。


8.創(chuàng)建一新圖層,繪制一條1px線,顏色為#808080,把它放到上面兩條線的中間,圖層模式不變,把不透明度降低到35%,效果如下。


9.依次復制上面兩個圖層,把這種效果添加到其他的導航文字中間,效果如下。


10.現在,我們來簡單制作翻滾效果。在一個文字的區(qū)域設置選區(qū),效果如下圖。

11.創(chuàng)建新圖層,填充選區(qū)為任意顏色,然后添加圖層樣式,漸變疊加: #666666 - #a1a1a1。


12.把字體的顏色改變?yōu)榘咨⑶姨砑油队靶Ч?#454545。

13.最終效果如下。

學習 · 提示

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

關注大神微博加入>>

網友求助,請回答!