Dreamweaver網(wǎng)頁制作

1、   認(rèn)識Dreamweaver一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問?！緦W(xué)習(xí)步驟】1、 Dreamweaver的功用Dreamweaver能夠像普通的字處置軟件一樣編輯Internet上以HTML格式保管的一切文件，也就是網(wǎng)頁；它支持動態(tài)HTML，能夠在網(wǎng)頁中產(chǎn)生動畫；還能夠在網(wǎng)頁中插入各種插件，以產(chǎn)生特殊效果。Dreamweaver可用于管理站點(diǎn)，它像文件夾一樣創(chuàng)立和翻開站點(diǎn)，用不同的方式查看站點(diǎn)中各個網(wǎng)頁之間的關(guān)系，調(diào)整站點(diǎn)的組織構(gòu)造，使整個站點(diǎn)條理明晰。2、 D

2、reamweaver的窗口（1）  標(biāo)題欄（2）  菜單欄（3）  工具欄（4）  視圖欄（5）  文件夾列表（6）  工作區(qū)3.網(wǎng)頁工作區(qū)的三個視圖方式選項它們分別是“普通”、“HTML”“預(yù)覽”，它們之間的互相切換非常容易完成的。普通視圖方式是Dreamweaver對網(wǎng)頁所見即所得編輯方式的最佳表現(xiàn)，在此方式下，能夠像在Word中那樣直接停止各種編輯操作，完成網(wǎng)頁編輯的一切功用。HTML視圖實踐上是一個文本編輯器，其中給出了普通視圖方式下所件網(wǎng)頁的HTML代碼。在這里能夠

3、用菜單命令停止復(fù)制、粘貼、刪除、查找等操作。關(guān)于HTML言語中的不同成分均用不同的顏色顯現(xiàn)，這樣比擬容易辨別各種語法成分。為了在制造網(wǎng)頁過程中可以隨時查看網(wǎng)頁的實踐效果，Dreamweaver提供了預(yù)覽視圖方式。4.裝置dreameaver的辦法    裝置及注冊5.關(guān)閉dreameaver6.保管網(wǎng)頁的辦法三、小結(jié)Dreamweaver的根本學(xué)問 樹立一個簡單的站點(diǎn)一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問；樹立一個簡單的站點(diǎn)；停止簡單的網(wǎng)頁編輯。【學(xué)習(xí)步驟】1

4、、創(chuàng)立空白站點(diǎn)。執(zhí)行菜單命令“文件”“新建”“站點(diǎn)”，就會呈現(xiàn)8中站點(diǎn)導(dǎo)游。出于簡單，可選擇“空站點(diǎn)”按鈕，并在“指定新站點(diǎn)的位置”框中填入站點(diǎn)的位置。在指定新站點(diǎn)的位置后，單擊“肯定”即建成一個空站點(diǎn)。2、樹立一個簡單的文字網(wǎng)頁樹立了一個站點(diǎn)之后，就應(yīng)該在站點(diǎn)中參加網(wǎng)頁了。  創(chuàng)立空白網(wǎng)頁執(zhí)行菜單命令“文件”“新建”“網(wǎng)頁”，就會呈現(xiàn)一對話框，選擇“普通網(wǎng)頁”模板并單擊“肯定”即樹立了一個新的空白頁面。  網(wǎng)頁工作區(qū)的三個視圖方式選項它們分別是“普通”、“HTML”“預(yù)覽”，它們之間的互相切換非常容易完成的。普通視圖方式是Dreamweaver對網(wǎng)頁所

5、見即所得編輯方式的最佳表現(xiàn)，在此方式下，能夠像在Word中那樣直接停止各種編輯操作，完成網(wǎng)頁編輯的所有功用。HTML視圖實踐上是一個文本編輯器，其中給出了普通視圖方式下所件網(wǎng)頁的HTML代碼。在這里能夠用菜單命令停止復(fù)制、粘貼、刪除、查找等操作。關(guān)于HTML言語中的不同成分均用不同的顏色顯現(xiàn)，這樣比擬容易辨別各種語法成分。為了在制造網(wǎng)頁過程中可以隨時查看網(wǎng)頁的實踐效果，Dreamweaver提供了預(yù)覽視圖方式。  輸入文本網(wǎng)頁中最根本的也是最重要的局部就是網(wǎng)頁中由文本構(gòu)成的內(nèi)容，因而制造網(wǎng)頁首先要從文本輸入開端。3、設(shè)置網(wǎng)頁中文字的字體、顏色、大小和效果 

6、0; 在文本開端處按下鼠標(biāo)左鍵，不放手拖到完畢處，選擇要設(shè)置的文本塊。   執(zhí)行菜單命令“格式字體”。   在“字體”對話框中，單擊“字體”選項卡。   在字體選擇窗口中，選定所需求的字體，再肯定文本的字型、大小、顏色、效果等。   按“肯定”即可。4、  網(wǎng)頁編輯（1）  將圖片插入網(wǎng)頁（2）  將剪貼畫插入網(wǎng)頁（3）  參加GIF動畫（4）  保管嵌入式圖形文件（

7、5）  運(yùn)用圖片工具欄（6）  設(shè)置圖片屬性（7）  設(shè)置網(wǎng)頁背景（8）  設(shè)置超鏈接（9）  應(yīng)用框架（10）   表單的運(yùn)用 5、小結(jié)簡單站點(diǎn)的樹立過程   設(shè)計限時自動關(guān)閉的網(wǎng)頁一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問；用Dreamweaver設(shè)計限時自動關(guān)閉的網(wǎng)頁?！緦W(xué)習(xí)步驟】設(shè)計頁面時，經(jīng)常會從一個頁面翻開一個子窗口以供閱讀者查看。通

8、常，這種子窗口中的內(nèi)容一經(jīng)閱讀者看過，關(guān)于閱讀者而言就不再需求，而他們常常會遺忘關(guān)掉這些小窗口，致使許多的閱讀器窗口翻開著，耗用大量的資源。因而我們能夠?qū)⒆哟翱谠O(shè)計成經(jīng)過一段時間后能夠自動關(guān)閉的方式。1. 在本地站點(diǎn)中生成一個Smlple文件夾。2. 在Smlple文件夾中，生成名為Index.html以及名為firstpage.html的文件。3. 雙擊Index.html，翻開該文檔，進(jìn)入到文檔的設(shè)計視圖窗口中。4. 單擊菜單View/Head Content，顯現(xiàn)文檔的頭部區(qū)域。5. 單擊設(shè)計視圖窗口中的文檔頭部窗格。選擇菜單Insert

9、/Invisible Tags/Script，翻開Inset Script對話框。如圖所示，在Language下拉列表框當(dāng)選擇javascript選項，并在Coctento文本框中輸入“setTimeout("self.close()"，15000)”。單擊OK按鈕，完成在文檔頭部插入15秒后自動關(guān)閉子窗口的腳本。在代碼中，15000表示15000毫秒，也即15秒，也能夠依據(jù)需求將之修正為本人需求的時間毫秒數(shù)。設(shè)置時間6. 在文檔窗口中輸入“關(guān)閉”字樣，在屬性面板上的Link文本框中輸入“#”，將其設(shè)置為一個空鏈接。7. 在狀態(tài)欄左端的快速標(biāo)志編輯器上，

10、單擊標(biāo)志按鈕。選中“關(guān)閉”鏈接，然后按下Ctrl+T組合鍵，翻開快速標(biāo)志編輯器，進(jìn)入到快速標(biāo)志編輯器的編輯標(biāo)志形式。然后在“>”前輸入“onclick="selfclose()"”。 如圖所示，設(shè)置終了，單擊OK按鈕，確認(rèn)操作。這樣在Index.html被作為子窗口翻開后，單擊該鏈接就能夠立即關(guān)閉該子窗口。8. 保管Index.html文件，并退出index.html的Dremweaver窗口。9. 如今開端設(shè)計fristpage.html頁面。在本地站點(diǎn)的Smlple文件夾中，雙擊 fristpage.html，翻開該文檔，進(jìn)

11、入到文檔的設(shè)計視圖窗口中。10. 在文檔中輸入“單擊這里翻開會自動關(guān)閉的子窗口”字樣。然后在屬性面板上的 Link文本框中輸入“#”，將之設(shè)置為空鏈接。11. 能夠經(jīng)過為該鏈接應(yīng)用Open Browser Window行為來設(shè)置單擊鏈接時翻開Index.html窗口，不過更便當(dāng)?shù)霓k法是應(yīng)用快速標(biāo)識編輯器。辦法是首先將插入點(diǎn)放置到鏈接中，然后在狀態(tài)欄左端的標(biāo)識選擇器上，單擊標(biāo)識按鈕，選中整個鏈接。然后按下Ctrl+T組合鍵，翻開快速標(biāo)志編輯器，進(jìn)入到快速標(biāo)志編輯器的 編輯標(biāo)識形式。再在“>”前輸入“onclick="window.open(

12、'index.html',null','width=200px，height=200px')"”（如圖所示）。設(shè)置終了，按下回車鍵，確認(rèn)操作。設(shè)置單擊鏈接時翻開12.上述操作就完成了本例的設(shè)置。能夠單擊菜單用File/save，保管所做的工作。然后按下F12鍵，在閱讀器中預(yù)覽頁面效果。三、小結(jié)    用Dreamweaver設(shè)計限時自動關(guān)閉的網(wǎng)頁用Dreamweaver做會挪動的文字一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問

13、；用Dreamweaver做會挪動的文字?！緦W(xué)習(xí)步驟】一、根本語法啦啦啦，我會挪動耶！文字挪動屬性的設(shè)置：方向<direction=#> #=left, right 啦啦啦，我從右向左移！方式<bihavior=#> #=scroll, slide, alternate 啦啦啦，我一圈一圈繞著走！循環(huán) <loop=#> #=次數(shù)；若未指定則循環(huán)不止(infinite) 啦啦啦，我只走 3 趟喲！速度<scrollamount=#> 啦啦啦，我走得好快喲！< ;/marqu

14、ee>對齊方式(Align)<align=#> #=top, middle, bottom 啦啦啦，我會挪動耶！對齊上沿、中間、下沿。二 、小結(jié)   用Dreamweaver做會挪動的文字  用Dreamweaver創(chuàng)立導(dǎo)航條一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問；用Dreamweaver創(chuàng)立導(dǎo)航條?！緦W(xué)習(xí)步驟】一個網(wǎng)站的不同頁面運(yùn)用了同一導(dǎo)航條。經(jīng)過統(tǒng)一導(dǎo)航條的辦法，我們能夠完成網(wǎng)站作風(fēng)的統(tǒng)一，同時也便當(dāng)了閱讀者在不同頁

15、面間的跳轉(zhuǎn)。用Dreamweaver可作出各種比擬復(fù)雜的導(dǎo)航條。網(wǎng)頁上的導(dǎo)航條可由一個或幾個局部組成，每個局部均由各種圖像構(gòu)成，能夠鏈接到不同的網(wǎng)頁頁面。在Dreamweaver中每局部中最多可設(shè)四個狀態(tài)下的圖像。一開端是一個初始圖像，當(dāng)鼠標(biāo)挪動到導(dǎo)航條部位上時則顯現(xiàn)另一個圖像，還能夠設(shè)置當(dāng)鼠標(biāo)點(diǎn)擊后的初始圖像，以及鼠標(biāo)點(diǎn)擊后當(dāng)鼠標(biāo)再次挪動到這個部位上的圖像。普通地，每部位只設(shè)一到兩種狀態(tài)的圖像。由于圖像太多了，會影響網(wǎng)頁頁面的訪問、閱讀的速度。導(dǎo)航條制造辦法：挪動光標(biāo)到需求導(dǎo)航條的中央，單擊主菜單欄的“InsertNavigation Bar”子命令，或直接單擊Objects面板上的圖標(biāo)，彈

16、出“Insert Navigation Bar”對話框，如下圖，此時我們能夠停止各種設(shè)置來完成上述功用：在“Element Name”項后的文本框填入這個部位的命名，也能夠不填，這時Dreamweaver 3將自動給它命名。在Dreamweaver中每局部中最多可設(shè)四個狀態(tài)下的圖像：“Up Image”項是該部位的初始圖像，在其后文本框填入已準(zhǔn)備好的圖像的地址，或點(diǎn)擊右邊Browse按鈕來選擇。每個部位可只設(shè)置Up Image項，其下的“Over Image”、“Down Image”和“Over While Down Image”三項能夠不設(shè)置。其中，“Over Image”項是鼠標(biāo)挪動到這

17、個部位上時顯現(xiàn)的圖像(本例當(dāng)選擇)；“Down Image”項是鼠標(biāo)點(diǎn)擊該部位后顯現(xiàn)的初始圖像；“Over While Down Image”項是鼠標(biāo)點(diǎn)擊后當(dāng)鼠標(biāo)再次挪動到這個部位上時顯現(xiàn)的圖像。留意：Element Name項和 Up Image項是必需的，一切的調(diào)用圖像都會在系統(tǒng)的提示下保管在Dreamweaver 3文件夾中，以便調(diào)用。三 、小結(jié)      用Dreamweaver創(chuàng)立導(dǎo)航條   用Dreamweaver創(chuàng)立導(dǎo)航條一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用D

18、reamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問；用Dreamweaver創(chuàng)立導(dǎo)航條?！緦W(xué)習(xí)步驟】當(dāng)然，還可給該部位設(shè)置超級鏈接：在下面的“When Clicked Go To URL”項后文本框填入鏈接到的文件的地址，或單擊Browse按鈕選擇，當(dāng)鼠標(biāo)挪動到這個部位上時，在狀態(tài)欄中能夠看到鏈接到的地址。When Clicked Go To URL項后有一個下拉選框，這是設(shè)置超級鏈接的目的。接著是“Options”項，若選中“Preload Images”選框，則閱讀者閱讀頁面時，一切圖像將在頁面下載的同時全部下載，整個頁面翻開的速度會慢些，但圖像間轉(zhuǎn)換會沒有延遲，選

19、中它。反之，不選Preload Images選框，則頁面下載的同時只下載初始圖像，其它圖像按次第下載，整個頁面翻開的速度較快，但圖像間轉(zhuǎn)換會有延遲。若選中“Show “Down Image”Initially”選框，則將Down Image設(shè)為初始圖像。此時，Over While Down Image項改為鼠標(biāo)挪動到這個部位上時顯現(xiàn)的圖像，Up Image項改為鼠標(biāo)點(diǎn)擊該部位后顯現(xiàn)的初始圖像，Over image項改為鼠標(biāo)點(diǎn)擊后當(dāng)鼠標(biāo)再次挪動到這個部位上時顯現(xiàn)的圖像。最下面是“ Insert”項，選框中有Horizontally(程度)和Vertically(垂直)兩個選項。選中Horizon

20、tally為導(dǎo)航條程度展開，選中Vertically 為導(dǎo)航條垂直展開。 Use Table 項，選中后，Dreamweaver自動生成HTML代碼將導(dǎo)航條各部位用表格隔開。當(dāng)一個部位設(shè)置完成后，要添加其他部位，可點(diǎn)擊對話框上方的“”按鈕，可按上面的步驟停止新部位的設(shè)置。要刪去某一個部位，在“Nav Bar Elements”選框中先選中，再點(diǎn)擊對話框上方的“”按鈕即可。另外，運(yùn)用設(shè)置導(dǎo)航條圖像中的高級功用，可改動文檔中基于當(dāng)前按鈕下的其他的圖像。在默許下,單擊導(dǎo)航條中的元素時,一切導(dǎo)航條中元素都會自動地返回原來默許的狀態(tài)。若想設(shè)置被選中圖像的上浮或是下沉的不同效

21、果時，可用導(dǎo)航條中的高級功用：在“Behaviors”面板中的“Actions”標(biāo)簽頁，單擊其上面的“”號按鈕，在彈出的菜單當(dāng)選擇“Set Nav Bar Image”命令，彈出Set Nav Bar Image 對話框中(見圖2)，選擇“Advanced”標(biāo)簽頁，對高級屬性停止設(shè)置。其中，若選擇“Over Image or over while Down Image”項，則當(dāng)鼠標(biāo)劃過圖片時顯現(xiàn)其上面的圖片，有上浮或是下沉的效果，并在“Also Set Image”文本框當(dāng)選擇要顯現(xiàn)的圖片，同時在其下面的“If Down To Image File”當(dāng)選擇當(dāng)鼠標(biāo)按下時要顯現(xiàn)的圖片途徑

22、；若選擇“Down Image”項，則當(dāng)閱讀者單擊所選圖像后,顯現(xiàn)另外的圖片。圖2存盤后，按F12鍵測試所作導(dǎo)航條。三、小結(jié)    用Dreamweaver創(chuàng)立導(dǎo)航條用Dreamweaver創(chuàng)立狀態(tài)欄一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問；用Dreamweaver創(chuàng)立狀態(tài)欄?！緦W(xué)習(xí)步驟】狀態(tài)欄制造辦法：設(shè)置閱讀器狀態(tài)欄中的文本信息,這一功用可在閱讀網(wǎng)頁面時,在閱讀器窗口底下狀態(tài)欄中顯現(xiàn)相關(guān)信息。其辦法:選擇“Behaviors”面板中的Actions標(biāo)簽頁的“Set T

23、ext of Status Bar”命令,在彈出的Set Text of Status Bar對話框中如圖3,在“Message”的文本框中輸入所在狀態(tài)欄中顯現(xiàn)的文檔,按“OK”按鈕完成。再用按F12快捷鍵來測試,可看到其運(yùn)轉(zhuǎn)的效果。當(dāng)然可用JavaScript言語在Message文本框中參加些函數(shù),讓文本顯現(xiàn)功態(tài)的效果。三、小結(jié)用Dreamweaver創(chuàng)立狀態(tài)欄用Dreamweaver的模板創(chuàng)立網(wǎng)頁一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問；用Dreamweaver的模板創(chuàng)立網(wǎng)頁?！緦W(xué)習(xí)步驟】1、創(chuàng)立模板頁面最

24、簡單的方法是將一個網(wǎng)頁另存為模板文件，經(jīng)過執(zhí)行命令：FileSave as Template，DreamWeaver會在網(wǎng)站根目錄中樹立一個模板文件夾Templates來保管該模板。當(dāng)然，也能夠新建一個模板：WindowTemplates，會呈現(xiàn)的Templates面板，單擊右下角的New Template按鈕，輸入文件名，就樹立了一個空模板；再單擊Open Template按鈕翻開該模板，保管后自動寄存于網(wǎng)站模板文Templates中。新建、翻開的模板頁面和普通的網(wǎng)頁沒什么兩樣，同樣能夠參加表格、層、圖片、動畫、腳本，設(shè)置頁面屬性等。舉例：這里以制造一個模板為例來闡明。在該頁面中，我們希望左

25、側(cè)的網(wǎng)站標(biāo)識圖和底部的導(dǎo)航圖呈現(xiàn)在每個頁面中。其中標(biāo)識圖由兩幅圖片疊加而成，導(dǎo)航圖上的文字“最近更新”、“在線閱讀”、“打包下載”等劃分紅幾個熱辨別別鏈接到不同的文件，它們在每個頁面中都不變。右上部的主頁面區(qū)和左下角彈出式選單按鈕下面的頁面闡明則各不相同。為了堅持頁面整潔，我們用表格來布置這些元素。精確地說它只是一個沒有可編輯區(qū)域的“準(zhǔn)模板”，下面再設(shè)定可編輯區(qū)域。2、設(shè)定可編輯區(qū)域設(shè)定模板可編輯區(qū)域，普通來說有兩種辦法。新建可編輯區(qū)域：選擇命令：ModifyTemplateNew Editable Region。在某一空白區(qū)域中單擊后執(zhí)行該命令即可將該區(qū)域變?yōu)榭删庉媴^(qū)域。標(biāo)志某一區(qū)域為可編輯

26、區(qū)域：選擇命令：ModifyTemplateMark Selectin as Editable Region。假如某區(qū)域曾經(jīng)有一些文字，并且希望在以后新建的超文本文件中局部保存其內(nèi)容，先選中該區(qū)域再執(zhí)行標(biāo)志命令即可。取消可編輯狀態(tài)：選擇命令：ModifyTemplateUnmark Editable Region。執(zhí)行該命令后會彈出一個對話框，其中有當(dāng)前已有的可編輯區(qū)域列表，選中要取消的區(qū)域稱號，確認(rèn)即可。舉例：在大片空白區(qū)中隨意單擊一下，執(zhí)行ModifyTemplateNew Editable Region命令，在彈出對話框中輸入稱號：Main；選中左下角本頁闡明下面的文字，執(zhí)行Modify

27、TemplateMark Selectin as Editable Region命令，輸入稱號：exp。能夠看到可編輯區(qū)顯現(xiàn)為淺藍(lán)色，保管即完成模板制造。三、小結(jié)    用Dreamweaver的模板創(chuàng)立網(wǎng)頁 運(yùn)用模板一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問；用Dreamweaver的模板創(chuàng)立網(wǎng)頁?！緦W(xué)習(xí)步驟】1、依據(jù)模板新建頁面命令：FileNew From Template。彈出對話框，從模板列表當(dāng)選取模板，呈現(xiàn)的新頁面中除可編輯區(qū)外均有淡黃色背景，是不能停

28、止修正的局部?？瞻椎腗ain編輯區(qū)可直接停止插入表格、文字、圖片等操作，Exp編輯區(qū)保存有原來的文字，修正或重新編輯均可。2、對一個曾經(jīng)有內(nèi)容的頁面應(yīng)用模板命令：ModifyTemplateApply Template to Page。選擇模板后還會彈出一個對話框，讓您選擇現(xiàn)有的孤立內(nèi)容保管到哪個可編輯區(qū)域（Choose Editable Region for Orphaned Content）。要是不想保存則能夠選擇“（none）”。舉例：我們先新建一個普通頁面，輸入：“CIW電腦工作室”，執(zhí)行ModifyTemplateApply Template to Page命令，選擇模板test，現(xiàn)

29、有內(nèi)容保管區(qū)域選擇Main，確認(rèn)后可看到頁面自動變成了模板頁的方式，而“CIW電腦工作室”這一行字就呈現(xiàn)在主編輯窗口中。3、更新模板以全面更新站點(diǎn)基于某一模板樹立了一些頁面后，對模板停止修正后保管時，就會自動彈出一個對話框，列出一切運(yùn)用了該模板的頁面，訊問能否要更新。另外一種辦法是執(zhí)行ModifyTemplateUpdate Pages命令。從Update Pages對話框當(dāng)選擇一個站點(diǎn)或站點(diǎn)的某一種模板（同一站點(diǎn)中能夠運(yùn)用多個模板），單擊右側(cè)的Start按鈕，軟件會自動搜索與模板相關(guān)聯(lián)的網(wǎng)頁并停止更新。十分便當(dāng)！舉例：Test模板左側(cè)圖形中的“讀書破萬站”圖片是用一個圖層疊加在另一幅圖片之上

30、的，如今不想要它，同時還想將一切頁面中的該圖片均刪除。就能夠翻開模板test.dwt，刪除該圖層，保管模板，單擊右側(cè)的“Update”按鈕即可。留意：新建和運(yùn)用模板前需定義站點(diǎn)。辦法是，執(zhí)行命令：SiteDefine Sites；指定站點(diǎn)稱號和本地根目錄（Local Root）。模板運(yùn)用的是相對途徑，假如沒有指定網(wǎng)站在本地的位置，軟件就不能精確找到并保管模板文件；并且應(yīng)用模板新建和更新頁面時，頁面中的超鏈接也不能隨頁面文件保管位置的不同而相應(yīng)變化。三、小結(jié)    用Dreamweaver的模板創(chuàng)立網(wǎng)頁用Dreamweaver 中插入背景音樂一、

31、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問；用Dreamweaver 中插入背景音樂?！緦W(xué)習(xí)步驟】一、直接插入法1.翻開一張需求插入背景音樂的網(wǎng)頁，在菜單中找到這樣的命令： Windows - > Behaviors，調(diào)出“Behaviors”行為面板，如下圖所示(Dreamweaver MX 的面板)：2.點(diǎn)擊“+”號按鈕，選擇“play sound”命令，如下圖：假如此命令呈反白色，不可用，請在此命令下拉列表當(dāng)選擇“Show Even For”命令，在此子菜單里選擇“ IE 4

32、.0 ”以上的版本，由于IE 4.0 以上的版本才支持此種格式的音樂插入辦法。3.此時彈出插入文件窗口，按“Browser”按鈕選擇音樂文件，當(dāng)然是要閱讀器支持的音樂文件格式(如mid、wav、AIFF、AU)    4.插入之后網(wǎng)頁里會顯現(xiàn)一個“plugin”插件圖標(biāo)，但我們還需求作進(jìn)一步的調(diào)整。由于 Dreamweaver 自動插入了一段控制代碼，便當(dāng)我們定制激活背景音樂。但此功用不需求用到，那么就要把它刪除。代碼有兩段，分別如下：代碼一：代碼二：5.完成插入，此時的背景音樂還不能自動播放，點(diǎn)選插件圖標(biāo)，按“ctrl + F3”快

33、捷鍵，調(diào)出屬性面板，點(diǎn)擊右下角的“Parameters”按鈕，在彈出的窗口中停止修正，把參數(shù)“AutoStart”后面的“Value”缺省值“false”改成“true”（如下圖所示），這樣就到達(dá)翻開頁面背景音樂就響起的效果。我們曉得，音樂的播放是有時間長短的，假如希望它反復(fù)播放，能夠把上圖中的“Loop”參數(shù)值改成“true”。在 Dreamweaver 中插入背景音樂的幾種辦法屢次收到喜歡安定洋網(wǎng)絡(luò)學(xué)院的網(wǎng)友的信件，信中發(fā)問如何在 Dreamweaver 中插入背景音樂，如今讓我一次性向大家引見幾種背景音樂的插入辦法，讓更多的人去控制它。6.之前翻開

34、刪除代碼時我們看到了插入音樂的 HTML 標(biāo)志為 < EMBED > ，為了讓大家對它有愈加深化的理解，接下來援用一段 安定洋網(wǎng)絡(luò)學(xué)院 - > 設(shè)計教室 - > HTML 局部中的“HTML言語分析”中的一段，引見一下< EMBED >標(biāo)志的參數(shù)：三、小結(jié)    用Dreamweaver 中插入背景音樂  用Dreamweaver 中插入背景音樂一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)

35、用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問；用Dreamweaver 中插入背景音樂?！緦W(xué)習(xí)步驟】< EMBED > 是用來插入各種多媒體，格式能夠是 Midi、Wav、AIFF、AU 等等，Netscape 及 新版的 IE 都支持。其參數(shù)設(shè)定較多。如下：< EMBED src="your.mid" autostart="true" loop="true" hidden="true"

36、; > src="your.mid"設(shè)定 midi 檔案及途徑，能夠是相對或絕對。autostart=true能否在音樂檔下載完之后就自動播放。true 是，false 否 (內(nèi)定值)。 loop="true"能否自動重復(fù)播放。LOOP=2 表示反復(fù)兩次，true 是， false 否。HIDDEN="true"能否完整躲藏控制畫面，true 為是，no 為否 (內(nèi)定)。STARTTIME="

37、;分:秒"設(shè)定歌曲開端播放的時間。如 STARTTIME="00:30" 表示從第30秒處開端播放。 VOLUME="0-100"設(shè)定音量的大小，數(shù)值是0到100之間。內(nèi)定則為運(yùn)用系統(tǒng)自身的設(shè)定。WIDTH="整數(shù)" 和 HIGH="整數(shù)"設(shè)定控制面板的高度和寬度。(若 HIDDEN="no") ALIGN="center"設(shè)定控制面板和旁邊文字的對齊方式，其值能夠是 top、bottom、cen

38、ter、baseline、 left、right、texttop、middle、absmiddle、absbottom CONTROLS="smallconsole"設(shè)定控制面板的外觀。預(yù)設(shè)值是 console。console 普通正常面板 smallconsole 較小的面板 playbutton 只顯現(xiàn)播放按鈕 pausecutton 只顯現(xiàn)暫停按鈕 stopbutton 只顯現(xiàn)中止按鈕 volumelever 只顯現(xiàn)音量調(diào)理按鈕二、代碼法&

39、lt; BGSOUND >：< BGSOUND > 是用來插入背景音樂，但只適用于 IE，其參數(shù)設(shè)定不多。< BGSOUND src="your.mid" autostart=true loop=infinite >src="your.mid"設(shè)定 midi 檔案及途徑，能夠是相對或絕對。autostart=true能否在音樂檔下載完之后就自動播放。true 是，false 否 (內(nèi)定值)。loop=infinite能否自動重復(fù)播放。LOOP=2 

40、;表示反復(fù)兩次，Infinite 表示反復(fù)屢次。此種辦法就是直接把< BGSOUND >標(biāo)志放于網(wǎng)頁文件的< head >< /head >之間，設(shè)置好mid文件的途徑就行。參數(shù)的設(shè)置如文中講解。三、插件法有些人一直沒有舍棄 FrontPage 或許就由于在一些元素的插入中，Dreamweaver 沒有提供功用，或者不便當(dāng)。但我們曉得，Dreamweaver 支持插件，聲音插入插件為我們提供了便當(dāng)。插件下載：sound.mxp下載后雙擊文件，就能夠直接裝置了，裝置完成你能夠在“對象”面板的“Common”欄看

41、到一個喇叭圖標(biāo)。直接點(diǎn)擊此按鈕，就彈出如下圖所示的插入窗口：Forever：設(shè)置無限循環(huán)播放Never：不循環(huán)播放，即只播放一次NO of times：設(shè)置播放的次數(shù)點(diǎn)擊“Browser”按鈕選擇好聲音文件之后，按肯定完成制造。三、小結(jié)    應(yīng)用代碼法和插件法在Dreamweaver 中插入背景音樂用Dreamweaver在主頁中制造連續(xù)的背景音樂一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問；用Dreamweaver在主頁中制造連續(xù)的背景音樂。【學(xué)習(xí)步驟】一、堅持

42、背景音樂的時斷時續(xù)，效果很好，現(xiàn)引見如下，供制造個人主頁的朋友們參考： 首先運(yùn)用標(biāo)簽 framesetframe.frame.frameset 將主頁 (index.html) 屏幕分紅上下兩個幀，為了不毀壞頁面規(guī)劃，將上幀的高度設(shè)為 0；然后，在主頁上幀放置的超文本文件(back_music.htm)中設(shè)置網(wǎng)站的背景音樂，最好不要設(shè)置播放界面；最后，在主頁的下幀放置網(wǎng)站主頁的主要內(nèi)容(main.htm)。這樣一來，主頁下幀的頁面就成為主頁實踐的活動頁面，上幀的頁面在訪問者的整個閱讀過程中一直堅持靜止不動，設(shè)置的背景音樂也就不會中綴了

43、。主頁文件 index.html:htmlheadtitle時斷時續(xù)的背景音樂/title/headframeset frameborder="0" rows="0,*"frame src="back_music.htm" scrolling="no" noresize frameborder="0"frame src="main.htm" frameborder="0"noframesbodypplease browse the web pag

44、es with browser that supperts frames. /p/body/noframes/frameset/html上幀文件 back_music.htm(背景音樂為當(dāng)前目錄下的liang_zhu.mid,只播放一次)：htmlheadtitle/title/headbody!-背景音樂:-embed src="./liang_zhu.mid" hidden="true" autostart="true" loop="0"/body/html三、小結(jié)  &

45、#160; 用Dreamweaver在主頁中制造連續(xù)的背景音樂    DreamweaverMX制造導(dǎo)航下拉菜單一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問；DreamweaverMX制造導(dǎo)航下拉菜單?！緦W(xué)習(xí)步驟】Dreamweaver從出道以來，其煩瑣易用而又功用強(qiáng)大的“行為”(Behavior)不斷是大家所關(guān)注的熱點(diǎn)之一。在Dreamweaver MX(DW MX)中，對這一功用又有了擴(kuò)大與改良。在DW MX中，行為指的是為了響應(yīng)某一事情(Event)而采取的一

46、個操作(Action)。其中Event 指的是閱讀器的事情，比方窗口刷新、鼠標(biāo)挪動等。而 Action 指的是后臺響應(yīng)事情的 JavaScript 代碼，能夠完成相應(yīng)的操作，比方播放聲音、翻轉(zhuǎn)圖片等。用DW MX制造導(dǎo)航下拉菜單是網(wǎng)頁中經(jīng)常運(yùn)用的特效之一。(如圖)主要應(yīng)用了DW MX中的“Show-Hide Layers”行為。首先制造好導(dǎo)航條(圖1中的“產(chǎn)品中心”那一欄)，隨后添加一個層，作為下拉菜單將要顯現(xiàn)的位置，并填入下拉菜單的對應(yīng)欄目。接下來，翻開“Behaviors”面板，同時選中“產(chǎn)品中心”鏈接(留意，這個時分不可以選中剛剛建好的層

47、，否則無法應(yīng)用“Show-Hide Layers”行為)，單擊“+”號，選擇“Show-Hide Layers”，就能夠看到我們剛剛建好的層在選擇項中，能夠設(shè)定為躲藏或者顯現(xiàn)(如圖)。行為的妙用主要表現(xiàn)在：假如我們要完成下拉菜單，關(guān)鍵就是讓鼠標(biāo)移到“產(chǎn)品中心”鏈接上時，使層顯現(xiàn)；而鼠標(biāo)分開鏈接時，使層躲藏。依據(jù)這種思想，我們首先為這個層設(shè)立兩個Action，一個選擇Hide，一個選擇Show。然后，調(diào)整Event，將Hide Layer的Event設(shè)為OnMouseOut，即為鼠標(biāo)分開鏈接；而將Show Layer的Event設(shè)為OnMouseOver，即為鼠標(biāo)選中鏈接。按“F12”預(yù)覽，就可

48、看到我們期盼的效果。這樣，平常我們覺得很神秘的導(dǎo)航下拉菜單就能夠隨便在行為中完成。還能夠在導(dǎo)航鏈接上繼續(xù)應(yīng)用 “Swap Image”行為，完成鼠標(biāo)點(diǎn)選鏈接時呈現(xiàn)圖片翻轉(zhuǎn)效果。行為不是一個個孤立的特效，能夠由多個行為組合疊加完成復(fù)雜的功用，除了DW MX默許設(shè)置好的行為外，我們還能夠從上下載更多更酷的第三方行為，我們只需將它們直接復(fù)制到DreamweaverMXConfigurationBehaviorsActions目錄下即可，從而使DW MX的這一閃光點(diǎn)愈加眩目。三、小結(jié)    用DreamweaverMX制造導(dǎo)航下拉菜單 

49、60; 用Dreamweaver做彈出窗口一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問；用Dreamweaver做彈出窗口?！緦W(xué)習(xí)步驟】1.翻開一個頁面，設(shè)置頁面屬性。左邊境，頂部邊境為 0 ，在標(biāo)題處輸入標(biāo)題稱號。2. 在頁面中插入圖片。也能夠是文字， Flash 動畫等。小窗口頁面就準(zhǔn)備好了。給一個頁面添加彈出小窗口：1. 翻開需求添加彈出小窗口頁面，例如一個網(wǎng)站的首頁，在標(biāo)簽選擇器當(dāng)選擇“ body ”標(biāo)簽。2.

50、0;翻開行為面板，點(diǎn)擊“ + ”按鈕添加行為。3. 選擇“翻開閱讀器窗口”。4. 在要顯現(xiàn)的 URL 處，選擇彈出小窗口頁面文件。設(shè)置彈出小窗口屬性。5. 按 F12 ，在閱讀器中發(fā)布的效果如下圖。三、小結(jié)    用Dreamweaver做彈出窗口   Dreamweaver 頁面制造一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問；Dreamweav

51、er 頁面制造?！緦W(xué)習(xí)步驟】一、下邊的簡單網(wǎng)頁為例，敘說一下制造過程。簡單網(wǎng)頁如下圖：   在開端制造之前，我們先對這個頁面停止一下剖析?？纯催@個頁面用到了那些東西。網(wǎng)頁頂端的標(biāo)題“我的主頁”是一段文字。網(wǎng)頁中間是一幅圖片。最下端的歡送詞是一段文字。網(wǎng)頁背景是一深紫紅顏色。曉得了這個網(wǎng)頁的構(gòu)造以后我們就來能夠制造了。首先啟動Dreamweaver MX 2004，確保你曾經(jīng)用站點(diǎn)管理器樹立好了一個網(wǎng)站（根目錄）。為了制造便當(dāng)，請您事前翻開資源管理器，把要運(yùn)用的圖片搜集到網(wǎng)站目錄images文件夾內(nèi)。  【插入標(biāo)題文字】進(jìn)入頁面編輯設(shè)計

52、視圖狀態(tài)。在普通狀況下，編輯器默許左對齊，光標(biāo)在左上角閃爍，光標(biāo)位置就是插入點(diǎn)的位置。假如要想讓文字居中插入，點(diǎn)屬性面板居中按鈕即可。啟動中文輸入法輸入“我的主頁”四個字。字小不要緊，我們能夠?qū)λＶ乖O(shè)置。【設(shè)置文字的格式】選中文字，在上圖屬性面板中將字體魄式設(shè)置成默許字體，大小可恣意更改字號。并選中“B”將字體變粗。【設(shè)置文字的顏色】首先選中文字，在屬性面板中，單擊顏色選擇圖標(biāo)，在彈出的顏色選擇器中用滴管選取顏色即可?！驹O(shè)置網(wǎng)頁的標(biāo)題和背景顏色】 點(diǎn)擊“修正”菜單選“頁面屬性”。系統(tǒng)彈出頁面屬性對話框（如下圖）請在標(biāo)題輸入框填入標(biāo)題“我的主頁”。設(shè)置背景顏色：網(wǎng)頁背景能夠是圖片，也能夠是顏色

53、。此例是顏色。如上圖翻開背景顏色選擇器停止選取。假如背景要設(shè)為圖片，點(diǎn)擊背景圖象“閱讀”按鈕，系統(tǒng)彈出圖片選擇對話框，選中背景圖片文件，點(diǎn)擊肯定按鈕。設(shè)計視圖狀態(tài)，在標(biāo)題“我的主頁”右邊空白處單擊鼠標(biāo)，回車換一行，依照以下的步驟插入一幅畫圖片，并使這張圖片居中。您也能夠經(jīng)過屬性面板中的左對齊按鈕讓其居左安放?！静迦雸D像】選擇以下恣意一種辦法：運(yùn)用插入菜單：在“插入”菜單選“圖像”，彈出“選擇圖像源文件”對話框，選中該圖像文件，單擊肯定。如下圖：2）運(yùn)用插入欄（如下圖）：單擊插入欄對象按鈕>選 按鈕，彈出“選擇圖像源文件”對話框，其他操作同上。（3）運(yùn)用面板組“資源”面板（如下圖

54、）：點(diǎn)按鈕，展開根目錄的圖片文件夾，選定該文件，用鼠標(biāo)拖動至工作區(qū)適宜位置。一個圖片就插入終了了。（插入*.swf動畫文件，選擇“插入”菜單媒體Flash）?！据斎霘g送文字】在圖片右邊空白處單擊，回車換行。依然依照上述辦法，輸入文字“歡送您”然后，應(yīng)用屬性面板對文字停止設(shè)置。保管頁面。一個簡單的頁面就這樣編輯終了了。【預(yù)覽網(wǎng)頁】在頁面編輯器中按F12預(yù)覽網(wǎng)頁效果。網(wǎng)站中的第一頁，也就是首頁，我們通常在存盤時取名為index.htm。三、小結(jié)圖片插入和對齊設(shè)置；文字的格式、顏色和加粗等設(shè)置；背景顏色的設(shè)置；預(yù)覽網(wǎng)頁，查看實踐效果。用Dreamweaver 發(fā)布網(wǎng)站一、學(xué)習(xí)目的理解Dreamweaver，學(xué)會應(yīng)用Dreamweaver制造網(wǎng)頁。二、學(xué)習(xí)內(nèi)容Dreamweaver的根本學(xué)問；用Dreamweaver 發(fā)布網(wǎng)站?！緦W(xué)習(xí)步驟】在發(fā)