午夜视频在线网站,日韩视频精品在线,中文字幕精品一区二区三区在线,在线播放精品,1024你懂我懂的旧版人,欧美日韩一级黄色片,一区二区三区在线观看视频

分享

超簡單教程,制作一個漂亮網頁 - 今日頭條(TouTiao.com)

 老剛 2015-08-03

超簡單教程,制作一個漂亮網頁

我們需要先制作背景圖片。也就是網頁背景那塊藍色的部分。我們需要單獨做出來。

新建一個1920px*400px的文件

超簡單教程,制作一個漂亮網頁

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

超簡單教程,制作一個漂亮網頁

效果圖

超簡單教程,制作一個漂亮網頁

然后我們保存這張圖片為gif格式

這時候我們新建一個

1000*800的文件

我們把網頁效果圖制作出來。這里都是用到ps制作的。沒有寫任何代碼。這個過程我就不講了

大家制作好網頁效果圖完成的時候一定要注意把網頁背景圖層刪掉,保持透明

超簡單教程,制作一個漂亮網頁

下一步我們使用切片工具。把頁面進行切片。如下圖所示

注意每一個鏈接都要切片一下。切片工具和矩形選區(qū)工具一樣,拉一下就是一個切片

為了區(qū)分我這里加了背景。我們一會一定要記得去掉

超簡單教程,制作一個漂亮網頁

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

超簡單教程,制作一個漂亮網頁

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

超簡單教程,制作一個漂亮網頁

我們現在保存為web所用格式

超簡單教程,制作一個漂亮網頁

我們把這里選擇png—8

超簡單教程,制作一個漂亮網頁

保存

超簡單教程,制作一個漂亮網頁

保存完成后

效果圖

超簡單教程,制作一個漂亮網頁

保存完成后。會生成一個目錄和一個html文件。我們用瀏覽器打開這個html文件可以看看效果。由于我們保存時選擇的是png格式的所以看到的效果不美觀,且網頁靠左邊。我們要做的就是讓網頁有一個背景就是我們剛剛制作的藍色背景。且頁面居中

為了方便,這里我們使用 Dreamweaver。這個軟件破解版和安裝教程問度娘要這里就不多說。

打開 Dreamweaver界面

我們新建一個站點

超簡單教程,制作一個漂亮網頁

我們先要給網頁居中。

我們用Dreamweaver打開ps生成的html文件

進入Dreamweaver的設計視圖。注意看

超簡單教程,制作一個漂亮網頁

我們用鼠標點一下最外邊的這根線。(把鼠標放在四個角上單擊一下就可以選中)

選中

超簡單教程,制作一個漂亮網頁

然后把下邊的屬性設置為居中。注意看

超簡單教程,制作一個漂亮網頁

這樣網頁就居中了。

我們再添加一個背景

我們先把鼠標在旁邊空白地方單擊一下,然后點擊下面的頁面屬性

超簡單教程,制作一個漂亮網頁

把背景圖片設置為我們剛剛制作的背景圖。重復選擇no開頭的那個。其他的不用管。

超簡單教程,制作一個漂亮網頁

然后我們按ctrl+s保存好網頁。然后即可使用瀏覽器預覽效果了

超簡單教程,制作一個漂亮網頁

ps制作網頁就是這么簡單

    本站是提供個人知識管理的網絡存儲空間,所有內容均由用戶發(fā)布,不代表本站觀點。請注意甄別內容中的聯系方式、誘導購買等信息,謹防詐騙。如發(fā)現有害或侵權內容,請點擊一鍵舉報。
    轉藏 分享 獻花(0

    0條評論

    發(fā)表

    請遵守用戶 評論公約

    類似文章 更多