如果您喜歡『PS學習網』,請推薦給您身邊的朋友!本站永久域名:www.757877.live

設計漂亮網站主頁圖片的PS實例教程

當前位置 : PS學習網 > 實例教程 > 正文來源:網絡作者:網絡時間:2020-02-14人氣:

制作一個好的網頁,需要花費大量的時間,包含的內容也是非常多的,其中有按鈕、橫幅、圖標及其它素材等。制作的時候先規劃好大致的框架,然后由上至下慢慢細化各部分的內容,注意好整體搭配。最終效果

PS設計漂亮網站主頁圖片的實例教程

 

一、在我們打開PSD網格模板創作前, 我們首先需要先構造一下想象中的結構. 從上面的這張圖,你可以看出來:因為在一個排版中又有排版,所以這是一個有點復雜的結構。

PS設計漂亮網站主頁圖片的實例教程

 

二、構造了結構之后我們繼續. 打開16欄式的PSD模板文件. 打開 “圖像 >畫布大小” . 把畫布的寬度設置為 1200px 高度設置為 1700px .把背景色設置為 #ffffff 既白色。

PS設計漂亮網站主頁圖片的實例教程

 

三、用長方形工具在頂部畫一個寬100%高大概80px的長方形. 用顏色: #dddddd 填充它。

PS設計漂亮網站主頁圖片的實例教程

 

四、在長方形那層上面創建一個新層. 按住CRTL鍵鼠標點擊長方形層. 長方形就被選中了,然后把目標移至剛建的新層上. 選擇半徑 600px 的軟筆刷(如圖), 把其顏色設置為白色, 然后就像圖片所示那樣在選框上邊緣點幾下。通過這個技巧你畫出了一個微妙的照亮效果。你現在可以把這兩層聯合起來了。

PS設計漂亮網站主頁圖片的實例教程

 

五、建一個新層,再用長方形工具如圖所示在上端畫一個深灰色的小長方形。

PS設計漂亮網站主頁圖片的實例教程

 

六、在距離上端長方形500px處開始畫一個寬 100% 高 575px 的長方形. 設置其由 #d2d2d0到 #ffffff 的漸變色, 角度為-90,縮放為100%。

PS設計漂亮網站主頁圖片的實例教程 

PS設計漂亮網站主頁圖片的實例教程

 

七、現在我們如第五步那樣添加照亮效果。這個技巧我們將很頻繁地使用,因此下次用到的時候我只提示是第五步的效果。 在當前層之上簡歷一個新層。Ctrl+鼠標點擊這個大的長方形。選擇 600px的軟筆刷, 設置顏色為白色,如圖所示對選區的邊緣點擊多下。

PS設計漂亮網站主頁圖片的實例教程

 

八、創建一個新層畫一個400px高的長方形。這是用作我們網頁頁頭的。給它設置一個線性漸變,由顏色 #2787b7 to #258fcd。以下展示顏色的微妙變化。

PS設計漂亮網站主頁圖片的實例教程 

PS設計漂亮網站主頁圖片的實例教程 

PS設計漂亮網站主頁圖片的實例教程 

PS設計漂亮網站主頁圖片的實例教程

 

九、在頁首長方形塊底端畫一條1px的灰藍色的線, 混合屬性中添加陰影效果。陰影參數: 正底疊加, 透明度: 65%, 方向: -90, 距離: 1px , 寬度: 6px。之后再建一個新層,在灰藍色線下面畫一條1px的白線。通過這種方式,我們就可以創建一個輪廓鮮明的邊緣。可以說在你的設計中,你可以把這個技巧用于其他色塊。

PS設計漂亮網站主頁圖片的實例教程

 

十、創建一個新層,在畫布頂端用”長方形”工具化一個50px高的長方形,就如圖所示,這個長方形是用作導航的。

PS設計漂亮網站主頁圖片的實例教程

 

十一、為其添加陰影效果.參數如圖所示。

PS設計漂亮網站主頁圖片的實例教程

回頂部
股票涨跌有哪些规律