PS設(shè)計(jì)教程之制作WordPress新聞博客模(7)
第5步:Latest News區(qū)域制作
Latest news區(qū)域包含featured image,a categories,ribbon,post title,content和read more按鈕。在分割線下方40像素處,寫上Latest News,字體選用Helvetica Roman,大小18pt,顏色#141e1e。接著在下方的圖片展示區(qū)域放上275像素 x 120像素的樣圖。
用矩形工具創(chuàng)建一個(gè)顏色為#fea702,100像素 x 15像素的形狀,用文字工具在形狀的中央位置寫上文字BUSSINESS,字體為Helvetica Roman,大小8pt,顏色#ffffff。
應(yīng)用圖層樣式
· 內(nèi)陰影(顏色):#ffffff
復(fù)制文本圖層,并將原圖層顏色改為#c88300。上移文字圖層1像素。選中剛剛制作好的幾個(gè)圖層(矩形圖層,兩個(gè)business文字圖層),按住快捷鍵Ctrl+T調(diào)出變換操作,如圖旋轉(zhuǎn)45°。
在預(yù)覽圖片中選定一個(gè)選區(qū),選擇矩形圖層,應(yīng)用圖層蒙版?雌饋(lái)如下圖。
使用文字工具添加上下圖的內(nèi)容。相應(yīng)內(nèi)容的字體名,字體樣式,字體大小及字體顏色見下面中的紅色文字部分。
將本步驟制作好的圖層進(jìn)行分組,取名為post。復(fù)制該組,并整體右移30像素。將飄帶的顏色修改為#8170e8,并修改文字內(nèi)容。(譯者注:其實(shí)這里的操作就是一個(gè)整體復(fù)制的過(guò)程,因?yàn)閮?nèi)容圖示版面相同,所以創(chuàng)建文件夾,進(jìn)行整體復(fù)制,然后進(jìn)行局部修改)
第6步:文章分類
此處文字的參數(shù)與recent news的字體參數(shù)一樣。在下圖所示的展示區(qū)域放上60像素 x 60像素的樣圖,并為其添加上類別名。(注意下圖所示的紅色字體所顯示的距離)
用文字工具添加下圖所示的文字內(nèi)容。文字的顏色和字體與latest news中保持一致。
將以上制作好的圖層進(jìn)行分組,復(fù)制該組,放在下圖所示的相應(yīng)位置。
將題目分類分組。復(fù)制3份,放在下圖所示位置。
學(xué)習(xí) · 提示
相關(guān)教程
- 網(wǎng)頁(yè)模板,設(shè)計(jì)酒吧主題網(wǎng)頁(yè)模板實(shí)例
- ps設(shè)計(jì)藍(lán)色主題風(fēng)格的網(wǎng)站首頁(yè)模板教程
- ps黑色風(fēng)格網(wǎng)頁(yè)模板
- ps一個(gè)木紋風(fēng)格網(wǎng)頁(yè)模板
- PS設(shè)計(jì)一個(gè)葡萄酒博客網(wǎng)頁(yè)模板
- 如何設(shè)計(jì)與PSD模板標(biāo)題導(dǎo)航菜單教程
- ps設(shè)計(jì)心形網(wǎng)頁(yè)模板教程
- ps設(shè)計(jì)時(shí)尚風(fēng)格數(shù)碼科技電子商務(wù)網(wǎng)站模
- photoshop設(shè)計(jì)企業(yè)網(wǎng)站首頁(yè)實(shí)例
- PS設(shè)計(jì)教程之如何制作一個(gè)時(shí)尚的商業(yè)模
推薦教程
- PS教程:制作非常不錯(cuò)的wordpress博客網(wǎng)站模板
- ps設(shè)計(jì)制作居家風(fēng)格美食Blog網(wǎng)頁(yè)特效
- Photoshop繪制木質(zhì)紋理的網(wǎng)站首頁(yè)模板
- Photoshop CS5制作放射狀光線網(wǎng)頁(yè)廣告板
- photoshop網(wǎng)頁(yè)應(yīng)用實(shí)例:制作蘋果導(dǎo)航欄
- Photoshop網(wǎng)頁(yè)設(shè)計(jì):雜志風(fēng)格網(wǎng)站界面
- PS教程:繪制清新的色彩生動(dòng)的網(wǎng)頁(yè)布局
- Photoshop繪制好看的老式wordpress主題
- Photoshop制作禮品店網(wǎng)站模板
- PhotoShop設(shè)計(jì)制作懷舊風(fēng)格網(wǎng)頁(yè)的詳細(xì)教程