教你如何用photoshop制作網(wǎng)頁外殼界面(4)
6.
Ok – 現(xiàn)在讓我們回到最初的Interface body 層.
Ctrl + 單擊使該層浮動(dòng).
執(zhí)行Select - Modify – Contract(選擇 – 修改 – 收縮) - 5 pixels - OK.
接著 Ctrl + Shift + I to 反轉(zhuǎn)選擇區(qū)域.
按Delete刪除.
7.
再次使該層浮動(dòng) (Ctrl + 單擊);
Select - Modify - Contract(選擇 – 修改 – 收縮) - 3 pixels - OK.
按下Delete鍵將Interface body層的中心部分刪除.我也為這一層添加了drop shadow(陰影)特效.
如圖七.
基本的界面我們已經(jīng)做好了, 但是它看起來并不怎么惹人喜愛.
讓我們?yōu)樗尤胄┘?xì)節(jié)吧!
8.
使Interface layer層浮動(dòng).
執(zhí)行Edit - Copy Merged(編輯 – 拷貝合并). 接著Edit – Paste(編輯 –粘貼).
將新層更名為Interface details.
使Interface details層浮動(dòng),執(zhí)行
Select - Modify – Contract(選擇 – 修改 – 收縮) - 10 pixels - OK.
反選選擇區(qū)域(Ctrl + Shift + I) 按Delete鍵刪除.
取消選定.
選擇矩形選擇工具畫出如圖八的矩形選擇區(qū)域來.
在進(jìn)行下一步之前,請(qǐng)按下圖添加圖層特效.
- 相關(guān)教程
- TA的教程
- 收藏
- 返回
- 界面設(shè)計(jì)
學(xué)習(xí) · 提示
![](http://www.tgudhdp.cn/1diy/imges/noavatar.gif)
![](http://www.tgudhdp.cn/1diy/imges/noavatar.gif)
![](http://www.tgudhdp.cn/1diy/imges/noavatar.gif)
![](http://www.tgudhdp.cn/1diy/imges/noavatar.gif)
![](http://www.tgudhdp.cn/1diy/imges/noavatar.gif)
相關(guān)教程
- 陰影效果,教你制作各類陰影教程
- banner教程,設(shè)計(jì)一個(gè)簡(jiǎn)單的母親節(jié)Banner教程
- 陰影效果,制作網(wǎng)頁常見的圖片投影效果
- 網(wǎng)頁圖片,設(shè)計(jì)一個(gè)網(wǎng)頁登陸框圖片教程
- 設(shè)計(jì)知識(shí),新手詳情頁制作誤區(qū)
- 界面設(shè)計(jì),設(shè)計(jì)音樂播放器界面圖片
- 圖片教程,教你怎么做圓形圖表
- 圖片設(shè)計(jì),教你設(shè)計(jì)扁平化404錯(cuò)誤頁面圖片
- banner教程,超簡(jiǎn)單三步設(shè)計(jì)一個(gè)BANNER
- 圓角教程,教你制作網(wǎng)頁常用的圓角矩形邊角
推薦教程
- banner教程,用ps制作960*90的廣告圖片
- 用ps制作豎列導(dǎo)航
- 界面設(shè)計(jì),設(shè)計(jì)音樂播放器界面圖片
- Photoshop制作網(wǎng)站導(dǎo)航圖
- Photoshop教程:像素化細(xì)節(jié)設(shè)計(jì)技巧
- Photoshop制作網(wǎng)頁搜索條
- Photoshop設(shè)計(jì)網(wǎng)站用的藍(lán)色導(dǎo)航圖框
- 陰影效果,教你制作各類陰影教程
- Photoshop精細(xì)制作Vista風(fēng)格網(wǎng)站導(dǎo)航條
- PS教程:設(shè)計(jì)導(dǎo)航鼠標(biāo)懸停狀態(tài)小效果