如何使用ps和DW制作網(wǎng)頁?使用ps和DW制作網(wǎng)頁的方法
想知道如何快速簡單的建立一個網(wǎng)頁,小編今天為大家?guī)淼氖侨绾问褂胮s和DW輕松制作網(wǎng)頁,或許當我們看到一些導航網(wǎng)站時候,可能覺得制作一個網(wǎng)頁一定不簡單,那怎么讓制作網(wǎng)頁變得簡單起來呢?一起來看看吧!
只需要兩個軟件:ps和Dreamweaver!
效果圖:

我們需要先制作背景圖片。也就是網(wǎng)頁背景那塊藍色的部分。我們需要單獨做出來。
新建一個1920px*400px的文件

我們拉一個一個藍色(#506dbb)到白色的一個漸變

效果圖

然后我們保存這張圖片為gif格式
這時候我們新建一個
1000*800的文件
我們把網(wǎng)頁效果圖制作出來。這里都是用到ps制作的。沒有寫任何代碼。這個過程我就不講了
大家制作好網(wǎng)頁效果圖完成的時候一定要注意把網(wǎng)頁背景圖層刪掉,保持透明

下一步我們使用切片工具。把頁面進行切片。如下圖所示
注意每一個鏈接都要切片一下。切片工具和矩形選區(qū)工具一樣,拉一下就是一個切片
為了區(qū)分我這里加了背景。我們一會一定要記得去掉

我們再使用切片選擇工具選擇單個切片。然后右鍵

我們再逐個為切片添加鏈接

注意我們上面的加的黑色背景一定要記得去掉
我們現(xiàn)在保存為web所用格式

我們把這里選擇jpg—8

保存

以上就是小編為大家?guī)淼娜筷P于如何使用PS和DW制作網(wǎng)頁方法的全部內容了,希望可以幫助到大家!
相關文章

Adobe photoshop CC 2017安裝到別的盤圖文詳細教程
Adobe photoshop是一款修圖軟件,很多朋友們還不知道Adobe photoshop CC 2017如何安裝到別的盤?下面小編就給大家?guī)碓敿毜慕坛?,一起來看看?/div> 2016-11-25Photoshop最新技術SkyReplace能一鍵換天 小白也會玩
在早前的Adobe MAX 2016發(fā)布會中,Adobe 展示了新的后制技術名為 SkyReplace,簡單來說,就是因為我們有時拍照為了遷就前景,于是天空過曝,又或天空無云或太多云,所以要2016-11-14手機Photoshop怎么裁剪修改圖片的大???手機安裝了Photoshop,想裁剪圖片,該怎么裁剪呢?下面我們就來看看詳細的教程,需要的朋友可以參考下2016-09-07導讀:photoshop是每個平面設計工作者都要掌握的一款軟件,它功能強大,能勝任任何圖片處理操作。通過下面幾點PS教程來教大家怎么快速入門,步入平面設計領域。2016-10-21導讀:我們經(jīng)常會遇到想要的圖片常常都附有水印,小范圍的水印可以用Photoshop或者美圖秀秀修一下,但是遇到大量重復水印就沒轍了。那么重復水印到底怎么去掉呢,這里有一個2016-08-26在本篇教程中將會為大家?guī)淼氖莗hotoshop的前景色和背景色工具的介紹,非常簡單,但是一定要了解哦!2016-08-24Dreamweaver如何設置圖像屬性?DW設置圖像屬性方法介紹
Dreamweaver如何設置圖像屬性?很多新手并不是很清楚,所以下面小編就為大家詳細介紹DW設置圖像屬性方法,不會的朋友可以參考本文,希望能對大家有所幫助2016-02-27Dreamweaver中如何設置熱區(qū)?DW設置熱區(qū)方法圖解
Dreamweaver中如何設置熱區(qū)?很多新手并不是很清楚,所以下面小編就為大家詳細介紹DW設置熱區(qū)方法,不會的朋友可以參考本文,希望能對大家有所幫助2016-02-27Dreamweaver創(chuàng)建表格和表格的編輯方法介紹
這篇教程是向腳本之家的朋友分享Dreamweaver創(chuàng)建表格和表格的編輯方法,教程比較基礎,適合新手來學習,推薦到腳本之家,大家一起來學習吧2016-02-21Dreamweaver如何創(chuàng)建自己的站點并管理刪除呢?
Dreamweaver提供了對站點的創(chuàng)建及管理功能,通過以樹型結構來展示網(wǎng)站的內容分布,從而實現(xiàn)了對站點布局及細節(jié)內容的展示及修改,這項功能對于各位網(wǎng)頁設計者而言更有用,2016-02-17最新評論





