PS簡潔網頁美工教程(4)
27 選擇橢圓形工具創(chuàng)建方型大小80px乘以35px命名為"submit btn".
28 雙擊圖層打開圖層樣式對話框 ,勾選左邊的漸變疊加對話框. 點擊漸變編輯按照如下變更顏色 .

29 選擇文字工具,鍵入"Submit" 使用字體Arial, 粗體樣式 大小為13pt. 選擇"submit 按鈕" 和 "Submit 文字").
30 在工具面板選擇移動工具 在選項條設置水平居中和垂直居中.

創(chuàng)建主要內容區(qū)域
31創(chuàng)建新組命名為"content". 選擇橢圓形工具(U).新建300px 乘以 175px 命名為"c01". 放置此層在距離頭部30px 以下 距離左邊參考線0px. 雙擊層,設置如下樣式.

32 我們繼續(xù)為該層填充內容. 選擇文字工具增加文字, "About SmashingDzine". 使用文章工具選擇"About" 文字,改變顏色為#b47825. 選擇"Smashing"文字,改變顏色為#2f2f2f. 增加簡短描述和文字連接. 參考以下設置.

標題設置:
字體: Trebuchet MS, 樣式: Normal,大小: 24pt,反鋸齒選項: 銳利
描述設置:
字體: Arial, 樣式: Normal, 大小: 12pt,反鋸齒選項: 無, 顏色: #767676
連接設置:
字體: Arial, 樣式: Bold,大小: 13pt, 反鋸齒選項:無, 顏色: #252525, 下劃線
33 緊靠描述的地方我們將增加多一個正方形. 選擇矩形工具,顏色 #ffffff, 按住Shift鍵,維持比例繪制矩形,大小為88px 乘以88px. 移動該矩形到距離左邊矩形("c01″).10px 的地方,命名為"border". 設置描邊如下:

34 創(chuàng)建另一個盒子,大小為82px 乘以 82px放置在"border" 層中央. 命名為"box" 顏色改變?yōu)?#d5d5d5. 選擇"content" 組的所有圖層,進入圖層> 新建> 創(chuàng)建組(Ctrl/Cmd + G) 命名為"about".

35 復制"about" 組 命名為 "services". 再重新復制一組命名為"portfopo". 我們現(xiàn)在有三個組("about", "services", and "portfopo"). 移動最后的組("portfopo")到右側的參考線.

36 在面板選中三個組,點擊圖層>分布> 水平中心分布.

37 變更 "services" 組 (center) 和 "portfopo" 組 (right) 如下.

創(chuàng)建頁腳
38 新建組命名為"footer". 選擇矩形工具(U)然后創(chuàng)建矩形大小為1200px 乘以100px 在我們布局的底部. 命名為 "footer bg". 復制 "header bg" 層的圖層樣式并且應用.

選擇文字工具,寫上版權聲明文字,和鏈接,樣式為Arial, 大小為12pt ,灰色(#dddddd).

40 我們開始在郵件增加郵件描述.創(chuàng)建新組在"footer" 層,命名為 "subscribe".選擇圓角橢圓形工具(U) 創(chuàng)建矩形大小85px 乘以 35px.圖層命名為"subscribe btn".
41 重復26步增加表單和標簽.
42選擇文字工具,拼寫"Subscribe" 樣式Arial,Bold大小13pt. 選擇所有層("subscribe btn" 和 "Subscribe text").
43 重復28步創(chuàng)建按鈕.
44選擇橢圓矩形工具 (U)設置半徑為3px.創(chuàng)建橢圓矩形為210px 乘以35px 應用白色為主(#ffffff)命名該層為"email field".


最后結果
最后結果已經完成,

學習 · 提示
相關教程