PS如何制作網(wǎng)頁

時間：2023-09-24 12:30:02 | 來源：網(wǎng)站運營

時間：2023-09-24 12:30:02 來源：網(wǎng)站運營

PS如何制作網(wǎng)頁：網(wǎng)頁設計包含了背景、導航條、按鈕、logo、文字等元素，用Photoshop軟件將這些元素進行組合排版制作。本次案例以電影網(wǎng)站為設計主題。







方法/步驟

新建一個空白文件，打開“素材/網(wǎng)頁素材1.jpg”文件，使用“移動工具”將圖片移至當前畫布中，得到“圖層 1”。使用“自由變換”調(diào)整大小。效果如圖所示。



















使用 “矩形工具”將網(wǎng)頁布局劃分、顏色白色RGB為（255.255.255）、設置圖層混合模式：投影效果如圖所示。



















將形狀圖形載入選區(qū)。創(chuàng)建一個新圖層“圖層2”，使用 “漸變工具”顏色RGB為（178.178.178）（255.255.255）填充漸變效果，如圖所示。



















使用“移動工具”將導航條圖片移至當前畫布中，得到“圖層 3”。使用“自由變換”調(diào)整大小，如圖所示。



















制作內(nèi)容，打開“素材/網(wǎng)頁素材3.jpg、網(wǎng)頁素材4.jpg、網(wǎng)頁素材5.jpg、網(wǎng)頁素材6.jpg、網(wǎng)頁素材7.jpg”文件，使用“移動工具”將圖片移至當前畫布中，得到“圖層 4”、“圖層 5”、“圖層 6”、“圖層 7”、“圖層 8”。使用“自由變換”調(diào)整大小。效果如圖所示。



















使用 “橫排文字工具”字體大小為14點、中文字體（幼圓）、顏色RGB為（143.86.46）輸入每部電影的名稱，效果如圖所示。



















打開“素材/網(wǎng)頁素材8.jpg、網(wǎng)頁素材9.jpg、網(wǎng)頁素材10.jpg”文件，使用“移動工具”將圖片移至當前畫布中，得到“圖層 9”、“圖層 10” “圖層11”，使用“自由變換”調(diào)整大小。效果如圖所示。



















使用 “橫排文字工具”字體大小為18點、中文字體（黑體）、顏色RGB為（143.86.46）輸入每部電影簡介。效果如圖所示。



















打開“素材/網(wǎng)頁素材11.jpg”文件，使用“移動工具”將表格圖片移至當前畫布中，得到“圖層 12”，使用“自由變換”調(diào)整大小。效果如圖所示。



















使用 “橫排文字工具”字體大小為18點、中文字體（宋體）、顏色RGB為（143.86.46）輸入數(shù)字制作選擇菜單。打開“素材/第9章/網(wǎng)頁素材12.jpg、網(wǎng)頁素材13.jpg”文件，使用“移動工具”將按鈕圖片移至當前畫布中，得到“圖層 13”、“圖層 14”，刪除不需要的背景，使用“自由變換”調(diào)整大小。效果如圖所示。



















繪制矩形選區(qū)，單擊按鈕創(chuàng)建“圖層15”，使用 “漸變工具”填充顏色RGB為（255.255.255）到透明的漸變效果。選擇 “橫排文字工具”字體大小為16點、西文字體（Verdana）、顏色RGB為（255.255.255）輸入字體。效果如圖所示。



















打開“素材/網(wǎng)頁素材14.jpg”文件，使用“移動工具”將標志圖片移至當前畫布中，得到“圖層 16”，使用“自由變換”調(diào)整大小。效果如圖所示。



















使用 “橫排文字工具”字體大小為40點、西文字體（Lithos Pro）、顏色RGB為（188.202.112）和（143.86.46）輸入標題文字。效果如圖所示。













最終效果圖如圖所示。