Photoshop網(wǎng)頁制作教程

2022-12-26 13:37:42 來源/作者: / 己有:5人學(xué)習(xí)過
Photoshop網(wǎng)頁制作教程效果圖:

步驟 1

創(chuàng)建 750x500px 畫布,并將前景色設(shè)為白色。

創(chuàng)建新的圖層,利用矩形選框工具創(chuàng)建如下選區(qū)。

步驟 2

用白色填充選區(qū)。圖層 >> 圖層樣式 >> 投影。設(shè)置如下:

描邊:大小 1像素,顏色 #939393 不透明度 44%。

步驟 3

創(chuàng)建新圖層,再次利用矩形選框工具在畫布頂端建立如下矩形選框。(注意:為了實(shí)現(xiàn)網(wǎng)頁的層次感,這次的矩形邊框與之前的矩形左右兩邊各空出2個(gè)像素)

步驟 4

為選區(qū)填充 #2061A8。

步驟 5

圖層 >> 圖層樣式 >> 投影。設(shè)置如下:


漸變疊加:



圖案疊加:

步驟 6

為網(wǎng)站添加文字LOGO 。


步驟 7

創(chuàng)建新的圖層。

步驟 8

按照與步驟 3相同的方法在畫布底部建立矩形。

步驟 9

填充顏色(#2061A8),并添加投影效果。



圖層 >> 圖層樣式 >> 投影。


步驟 10

利用圓角矩形工具繪制如下形狀。



步驟 11

圖層 >> 圖層樣式 >> 投影。

漸變疊加:



步驟 12

為導(dǎo)航欄添加文字。

步驟 13

按照如上方法建立其余導(dǎo)航條。



步驟 14

現(xiàn)在我們開始制作內(nèi)容框,利用圓角矩形繪制如下矩形框。



將圖層面板的填充屬性設(shè)為 0%。


圖層 >> 圖層樣式 >> 漸變疊加。



步驟 15

按照之前的方法建立另一個(gè)內(nèi)容框。



搜索更多相關(guān)主題的帖子:網(wǎng)頁制作 Photoshop 教程 選區(qū) 投影