dreamweaver怎么制作網(wǎng)頁(yè)模板?

對(duì)于很多初學(xué)網(wǎng)頁(yè)的人來(lái)說(shuō),dreamweaver常是首選的編輯軟件。制作模板會(huì)大大提高網(wǎng)頁(yè)的重復(fù)使用性,那如何使用dreamweaver制作模板網(wǎng)頁(yè)呢?我這里以建一個(gè)唐詩(shī)宋詞的網(wǎng)頁(yè)為例。

Adobe Dreamweaver CS5(DW) 簡(jiǎn)體中文官方完整正式安裝版
- 類型:網(wǎng)頁(yè)設(shè)計(jì)
- 大?。?/span>404MB
- 語(yǔ)言:簡(jiǎn)體中文
- 時(shí)間:2016-10-22
1、剛進(jìn)入dreamweaver點(diǎn)擊新建下方的更多,然后選擇空白頁(yè),頁(yè)面類型選擇html模板,布局選無(wú)就行了。
2、插入一個(gè)表格(菜單欄中選擇插入,再找到表格),表格里的布局自己根據(jù)需要設(shè)置,在這里我設(shè)置為行數(shù)為5,列為1,表格寬度為1000像素。插入表格后,選中整個(gè)表格,選中后表框會(huì)加黑加粗,在下方設(shè)置為居中對(duì)齊。
3、在表格第一行插入圖像(菜單欄中選擇插入,再找到圖像),第二行加入滾動(dòng)字幕。第三行插入表格(方法同上),1行4列,表格寬度為百分之一百。插入表格之后,再選中第三行的表格,選中后表格邊框會(huì)加黑加粗,在下方設(shè)置表格為居中對(duì)齊,寬度為20%。
4、第三行中選入一些文字,如首頁(yè),李白,杜甫,白居易。新建一個(gè)css文件,再建一個(gè)css,設(shè)置好類型中的顏色和背景中的顏色,加以區(qū)分。選中第三行,使用剛才新建的css,再新建一個(gè)css,表格的邊框使用該css。
5、在第四行插入可編輯區(qū)域。點(diǎn)擊確定,可編輯區(qū)域中的文字即EditRegion3可以去掉,換行可以擴(kuò)大可編輯區(qū)域的面積。
6、在第五行插入可編輯區(qū)域,我還插入了一條水平線,并加上了版權(quán)。最后保存。此時(shí)模板已經(jīng)建好。
7、新建,模板中的頁(yè),找到新建的模板,創(chuàng)建,保存為index.html(即網(wǎng)站的主頁(yè)),再重新打開(kāi)新建的模板,在可編輯區(qū)預(yù)報(bào)輸入李白的資料,保存為libai.com,此時(shí)你會(huì)發(fā)現(xiàn)只有在可編輯區(qū)域才能輸入內(nèi)容,其他區(qū)域都是不可操作的,這就是模板的特點(diǎn)。同理,在新建兩個(gè)作為杜甫和白居易的網(wǎng)頁(yè)。
8、現(xiàn)在就差用超鏈接把上面做的幾個(gè)網(wǎng)頁(yè)連接起來(lái)了。在模板中選中首頁(yè),在下方html中的鏈接中輸入首頁(yè)的名稱,即index.html,同理,選中李白,杜甫,白居易將他們連起來(lái)。超鏈接做好后在文字下方會(huì)多出一條橫線。
9、做完了之后在index.html中打開(kāi)可以看看做出的效果,點(diǎn)擊圖中的小地球圖標(biāo)就可進(jìn)行查看。
相關(guān)推薦:
Dreamweaver網(wǎng)頁(yè)版權(quán)符號(hào)怎么制作?
dreamweaver怎么做一個(gè)簡(jiǎn)單的網(wǎng)頁(yè)?
Dreamweaver CS5怎么設(shè)計(jì)制作網(wǎng)頁(yè)框架?
相關(guān)文章
dreamweaver 8怎么通過(guò)代碼設(shè)置頁(yè)面高寬顏色?
dreamweaver 8怎么通過(guò)代碼設(shè)置頁(yè)面高寬顏色?正常我們使用dw設(shè)計(jì)網(wǎng)頁(yè)都是用前臺(tái)來(lái)設(shè)計(jì)網(wǎng)頁(yè)的高寬,顏色等,該怎么直接使用代碼完成這些設(shè)置呢?下面我們就來(lái)看看詳細(xì)的教2017-02-26Dreamweaver怎么給頁(yè)面添加時(shí)間?
Dreamweaver怎么給頁(yè)面添加時(shí)間?想給頁(yè)面添加時(shí)間,該怎么添加呢?今天我們就來(lái)看看使用Dreamweaver給頁(yè)面添加時(shí)間的兩種方法,需要的朋友可以參考下2016-12-22Dreamweaver怎么給網(wǎng)頁(yè)添加音樂(lè)?
Dreamweaver怎么給網(wǎng)頁(yè)添加音樂(lè)?在設(shè)計(jì)網(wǎng)頁(yè)的時(shí)候,想在網(wǎng)頁(yè)中添加音樂(lè),該怎么添加呢?下面我們就來(lái)看看Dreamweaver插入音樂(lè)的教程,需要的朋友可以參考下2016-12-15- Dreamweaver注釋怎么設(shè)置快捷鍵?Dreamweaver想給注釋添加一個(gè)快捷鍵呢?下面我們就來(lái)看看dw設(shè)置注釋快捷鍵的教程,很簡(jiǎn)單,需要的朋友可以參考下2016-12-12
Dreamweaver怎么去掉熱點(diǎn)的黃色框/藍(lán)色框?
Dreamweaver怎么去掉熱點(diǎn)的黃色框/藍(lán)色框?Dreamweaver中有熱點(diǎn)的時(shí)候就會(huì)有黃色框或者藍(lán)色框,該怎么辦呢?該怎么去掉呢?下面我們就來(lái)看看詳細(xì)的教程,需要的朋友可以參2016-12-05Dreamweaver無(wú)法打開(kāi)提示javascript錯(cuò)誤怎么辦?
Dreamweaver無(wú)法打開(kāi)提示javascript錯(cuò)誤怎么辦?Dreamweaver無(wú)法啟動(dòng),總是提示javascript錯(cuò)誤,刪除部分軟件也不行,該怎么辦呢?下面我們就來(lái)看看詳細(xì)的解決辦法,需要的2016-11-25dreamweaver怎么設(shè)置段落首行自動(dòng)縮進(jìn)兩個(gè)字符?
dreamweaver怎么設(shè)置段落首行自動(dòng)縮進(jìn)?dreamweaver制作網(wǎng)頁(yè)的時(shí)候,想要讓文字首行自動(dòng)縮進(jìn)兩個(gè)字符,該怎么設(shè)計(jì)呢?下面我們就來(lái)看看詳細(xì)的教,需要的朋友可以參考下2016-11-20Dreamweaver CS5怎么設(shè)計(jì)制作網(wǎng)頁(yè)框架?
Dreamweaver CS5怎么設(shè)計(jì)制作網(wǎng)頁(yè)框架?dw設(shè)計(jì)網(wǎng)站網(wǎng)頁(yè)很方便,該怎么設(shè)計(jì)一個(gè)網(wǎng)頁(yè)的框架呢?下面我們就來(lái)看看詳細(xì)的教程,需要的朋友可以參考下2016-11-15dreamweaver 怎么在網(wǎng)頁(yè)中使用div展示圖片效果?
dreamweaver 怎么在網(wǎng)頁(yè)中使用div展示圖片效果?想給網(wǎng)站中插入一些圖片,怎么使用div展示圖片呢?下面我們就來(lái)看看詳細(xì)的設(shè)置方法,需要的朋友可以參考下2016-11-01dreamweaver cs5怎么給網(wǎng)頁(yè)制作圖片的擠壓效果?
dreamweaver cs5怎么給網(wǎng)頁(yè)制作圖片的擠壓效果?想使用dw給網(wǎng)頁(yè)制作圖片顯示出來(lái)是擠壓效果的樣式,該怎么設(shè)計(jì)呢?下面我們就來(lái)看看詳細(xì)的教程,需要的朋友可以參考下2016-10-24