PS網(wǎng)頁制作中切片應(yīng)用(2)

來源:薛欣博客 作者:薛欣姚輝 學(xué)習(xí):7727人次

11.大致的結(jié)構(gòu)切分完成后,我們?cè)賮韺?duì)文字信息進(jìn)行細(xì)致的切分,我們選擇【切片選擇】工具,選擇【最新推薦】這一欄中的切片,然后選擇選項(xiàng)欄中的【劃分按鈕】,如圖12-3-68所示。這時(shí)會(huì)彈出劃分選項(xiàng)對(duì)話框,我們可以在這里對(duì)劃分的屬性進(jìn)行設(shè)置,我們選擇【水平劃分】,在第一欄中我們輸入數(shù)值13,如圖12-3-69所示。

PS教程大禮包-第12章網(wǎng)頁設(shè)計(jì)中的應(yīng)用(五)PS教程大禮包-第12章網(wǎng)頁設(shè)計(jì)中的應(yīng)用(五)

圖12-3-68圖12-3-69

12.單擊【確定】,這樣【最新推薦】這欄的內(nèi)容就被我們平均劃分了,如圖12-3-70所示。PS教程大禮包-第12章網(wǎng)頁設(shè)計(jì)中的應(yīng)用(五)

圖12-3-70

13.用同樣的方法,我們接著對(duì)【名人坊】以及【導(dǎo)航】等內(nèi)容進(jìn)行劃分,有時(shí)我們的劃分不一定特別的精確,我們可以放大圖像對(duì)切片進(jìn)行一下調(diào)節(jié),劃分后效果如圖12-3-71所示。

PS教程大禮包-第12章網(wǎng)頁設(shè)計(jì)中的應(yīng)用(五)

圖12-3-71

14.我們接著打開第一張圖像,對(duì)其也進(jìn)行一下切片的劃分,如圖12-3-72所示。

PS教程大禮包-第12章網(wǎng)頁設(shè)計(jì)中的應(yīng)用(五)

圖12-3-72

15.我們將圖像全部切分完以后,就可以對(duì)圖像添加鏈接了,我們使用切片選擇工具對(duì)切片34進(jìn)行雙擊,這時(shí)就彈出了切片選項(xiàng)的對(duì)話框,如圖12-3-73所示。

PS教程大禮包-第12章網(wǎng)頁設(shè)計(jì)中的應(yīng)用(五)

圖12-3-73

16.在URL這欄中我們可以輸入我們需要鏈接的網(wǎng)址,比如:。如圖12-3-74所示。那么用同樣的方法,我們對(duì)其他的切片也可以這樣添加鏈接。

PS教程大禮包-第12章網(wǎng)頁設(shè)計(jì)中的應(yīng)用(五)

圖12-3-74

17.單擊【確定】,鏈接添加完以后,我們就可以對(duì)圖像進(jìn)行導(dǎo)出,我們選擇【文件】,【存儲(chǔ)為web和設(shè)備所用格式】,彈出的對(duì)話框,如圖12-3-75所示。

PS教程大禮包-第12章網(wǎng)頁設(shè)計(jì)中的應(yīng)用(五)

圖12-3-75

18.單擊【存儲(chǔ)】,在此對(duì)話框中我們輸入文件保存的名稱,保存類型我們?cè)O(shè)置為HTML,如圖12-3-76所示。然后單擊【保存】。

PS教程大禮包-第12章網(wǎng)頁設(shè)計(jì)中的應(yīng)用(五)

圖12-3-76

19我們?cè)俅未蜷_第一張圖像對(duì)其也添加鏈接,鏈接的URL設(shè)置為我們第二個(gè)網(wǎng)頁。然后進(jìn)行輸出,方法同上。這樣我們的網(wǎng)頁就制作完成了。

最終效果:

第一張網(wǎng)頁的預(yù)覽效果,如圖12-3-77所示。

PS教程大禮包-第12章網(wǎng)頁設(shè)計(jì)中的應(yīng)用(五)

圖12-3-77

我們用鼠標(biāo)單擊【Enter】按鈕,這樣我們就鏈接到了第二個(gè)頁面,如圖12-3-78所示。

PS教程大禮包-第12章網(wǎng)頁設(shè)計(jì)中的應(yīng)用(五)

圖12-3-78

我們?cè)俅螁螕粑覀冊(cè)谑醉撎砑拥逆溄,就?huì)鏈接到其他的網(wǎng)站頁面,如圖12-3-79所示。

PS教程大禮包-第12章網(wǎng)頁設(shè)計(jì)中的應(yīng)用(五)

圖12-3-79

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

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

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

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