《多媒體制作技術(shù)及應(yīng)用》ch 網(wǎng)站設(shè)計(jì)

第九章網(wǎng)站設(shè)計(jì)9.1網(wǎng)站設(shè)計(jì)基本知識(shí)9.1網(wǎng)站設(shè)計(jì)基本知識(shí)9.1.1網(wǎng)站設(shè)計(jì)WEB網(wǎng)站是由HomePage和相關(guān)網(wǎng)頁(yè)構(gòu)成的超文本信息的集合，網(wǎng)頁(yè)按一定的組織結(jié)構(gòu)和順序組合起來(lái)，使瀏覽者在訪問(wèn)該網(wǎng)站時(shí)能連接到各個(gè)網(wǎng)頁(yè)來(lái)觀看網(wǎng)頁(yè)內(nèi)容。用戶可以使用瀏覽器（如微軟的InternetExplorer）瀏覽這些頁(yè)面的內(nèi)容。網(wǎng)站設(shè)計(jì)，就是用HTML把多種媒體信息有效地組織起來(lái)，使瀏覽者高效、便捷地獲取這些信息。網(wǎng)站設(shè)計(jì)包含的內(nèi)容大體分兩個(gè)方面：一方面是信息的處理和組織，另一方面是網(wǎng)站的延伸設(shè)計(jì)。9.1網(wǎng)站設(shè)計(jì)基本知識(shí)9.1.2網(wǎng)頁(yè)文件的規(guī)劃與創(chuàng)意一個(gè)網(wǎng)站的成功與否，很重要的一個(gè)因素在于它的構(gòu)思、內(nèi)容的組織、好的創(chuàng)意及豐富詳實(shí)的內(nèi)容?；驹O(shè)計(jì)思路：1．網(wǎng)站的目標(biāo)與定位2．網(wǎng)頁(yè)的組織結(jié)構(gòu)3．資料的收集與整理4．選擇網(wǎng)頁(yè)的設(shè)計(jì)方法5．網(wǎng)站的整體風(fēng)格創(chuàng)意設(shè)計(jì)9.1網(wǎng)站設(shè)計(jì)基本知識(shí)9.1.3網(wǎng)頁(yè)制作軟件構(gòu)成WEB網(wǎng)站頁(yè)面的HTML文件是標(biāo)準(zhǔn)的ASCII文件，看起來(lái)像是加入了許多被稱為標(biāo)簽（tag）的特殊字符串的普通文本文件，我們可以用普通的文本編輯器制作和編輯。但使用文本編輯器制做網(wǎng)頁(yè)非常繁瑣而且不易布局和定位。目前有很多專門的網(wǎng)頁(yè)制作工具軟件，各有特色。9.1網(wǎng)站設(shè)計(jì)基本知識(shí)9.1.3網(wǎng)頁(yè)制作軟件

1．DreamWeaverDreamWeaver是一個(gè)功能強(qiáng)大的專業(yè)網(wǎng)頁(yè)設(shè)計(jì)軟件，包括可視化編輯、HTML代碼編輯的軟件包，并支持ActiveX、JavaScript、Java、Flash、ShockWave等，還能通過(guò)拖拽從頭到尾制作動(dòng)態(tài)的HTML動(dòng)畫(huà)，支持動(dòng)態(tài)HTML（DynamicHTML）的設(shè)計(jì)。同時(shí)它還提供了自動(dòng)更新頁(yè)面信息的功能。DreamWeaver采用了RoundtripHTML技術(shù)。這項(xiàng)技術(shù)使得網(wǎng)頁(yè)在DreamWeaver和HTML代碼編輯器之間進(jìn)行自由轉(zhuǎn)換，HTML句法及結(jié)構(gòu)不變。這樣，專業(yè)設(shè)計(jì)者可以在不改變?cè)芯庉嬃?xí)慣的同時(shí)，充分享受到可視化編輯帶來(lái)的益處。DreamWeaver具挑戰(zhàn)性和生命力的是它的開(kāi)放式設(shè)計(jì)，這項(xiàng)設(shè)計(jì)使任何人都可以輕易擴(kuò)展它的功能。9.1網(wǎng)站設(shè)計(jì)基本知識(shí)9.1.3網(wǎng)頁(yè)制作軟件

2．MicrosoftFrontPage如果對(duì)Word很熟悉，那么用FrontPage進(jìn)行網(wǎng)頁(yè)設(shè)計(jì)一定會(huì)非常順手。FrontPage功能強(qiáng)大，簡(jiǎn)單易用。頁(yè)面制作由Frontpage中的Editor完成，其工作窗口由3個(gè)標(biāo)簽頁(yè)組成，分別是“所見(jiàn)即所得”的編輯頁(yè)，HTML代碼編輯頁(yè)，預(yù)覽頁(yè)。Frontpage帶有圖形和GIF動(dòng)畫(huà)編輯器，支持CGI和CSS。向?qū)Ш湍０宥寄苁钩鯇W(xué)者在編輯網(wǎng)頁(yè)時(shí)感到更加方便。站點(diǎn)管理功能強(qiáng)大，在更新服務(wù)器上的站點(diǎn)時(shí)，不需要?jiǎng)?chuàng)建更改文件的目錄，F(xiàn)rontPage會(huì)跟蹤文件并拷貝那些新版本文件。9.1網(wǎng)站設(shè)計(jì)基本知識(shí)9.1.3網(wǎng)頁(yè)制作軟件

3．Netscape編輯器NetscapeCommunicator和NetscapeNavigatorGold版本的瀏覽器都帶有網(wǎng)頁(yè)編輯器。當(dāng)用Netscape瀏覽器顯示網(wǎng)頁(yè)時(shí)，單擊編輯按鈕，Netscape就會(huì)把網(wǎng)頁(yè)存儲(chǔ)在硬盤中，然后就可以開(kāi)始編輯?？梢韵袷褂肳ord那樣編輯文字、字體、顏色，改變主頁(yè)作者、標(biāo)題、背景顏色或圖像，定義錨點(diǎn)，插入鏈接，定義文檔編碼，插入圖像，創(chuàng)建表格等。Netscape編輯器是網(wǎng)頁(yè)制作初學(xué)者很好的入門工具。如果網(wǎng)頁(yè)主要是由文本和圖片組成的，Netscape編輯器將是一個(gè)輕松的選擇。9.1網(wǎng)站設(shè)計(jì)基本知識(shí)9.1.3網(wǎng)頁(yè)制作軟件

4．AdobePagemillPagemill功能不算強(qiáng)大，但使用起來(lái)很方便，適合初學(xué)者制作較為美觀、而不是非常復(fù)雜的主頁(yè)。能夠很方便地編輯需要很多框架、表單和ImageMap圖像的網(wǎng)頁(yè)。Pagemill創(chuàng)建多框架頁(yè)十分方便，可以同時(shí)編輯各個(gè)框架中的內(nèi)容。Pagemill在服務(wù)器端或客戶端都可創(chuàng)建與處理ImageMap圖像，也支持表單創(chuàng)建。Pagemill允許在HTML代碼上編寫和修改，支持大部分常見(jiàn)的HTML擴(kuò)展，還提供拼寫檢錯(cuò)、搜索替換等文檔處理工具。在Pagemill3.0增加了站點(diǎn)管理能力，但仍不支持CSS、TrueDoc和動(dòng)態(tài)HTML等高級(jí)特性。Pagemill另一大特色是有一個(gè)剪貼板，可以將任意多的文本、圖形、表格拖放到里面，需要時(shí)再打開(kāi)，很方便。9.1網(wǎng)站設(shè)計(jì)基本知識(shí)9.1.3網(wǎng)頁(yè)制作軟件

5．ClarisHomePage如果使用ClarisHomePage軟件，可以在幾分鐘之內(nèi)創(chuàng)建一個(gè)動(dòng)態(tài)網(wǎng)頁(yè)。它有一個(gè)很好的創(chuàng)建和編輯Frame（框架）的工具，不必花費(fèi)太多的力氣就可以增加新的Frame（框架）。而且ClarisHomePage3.0集成了FileMaker數(shù)據(jù)庫(kù)，增強(qiáng)的站點(diǎn)管理特性還允許檢測(cè)頁(yè)面的合法連接。9.1網(wǎng)網(wǎng)站設(shè)計(jì)計(jì)基本知識(shí)識(shí)9.1.3網(wǎng)頁(yè)頁(yè)制作軟件件6．HotDogProfessionalHotDog是較早早基于代碼碼的網(wǎng)頁(yè)設(shè)設(shè)計(jì)工具，，其最具特特色的是提提供了許多多向?qū)Чぞ呔?，能幫助助設(shè)計(jì)者制制作頁(yè)面中中的復(fù)雜部部分。HotDog對(duì)plugin的的支持也遠(yuǎn)遠(yuǎn)遠(yuǎn)超過(guò)其其他產(chǎn)品，，它提供的的對(duì)話框允允許以手動(dòng)動(dòng)方式為不不同格式的的文件選擇擇不同的選選項(xiàng)。HotDog是個(gè)功功能強(qiáng)大的的軟件，對(duì)對(duì)于那些希希望在網(wǎng)頁(yè)頁(yè)中加入CSS、Java、、RealVideo等復(fù)雜雜技術(shù)的高高級(jí)設(shè)計(jì)者者，是個(gè)很很好的選擇擇。9.1網(wǎng)網(wǎng)站設(shè)計(jì)計(jì)基本知識(shí)識(shí)9.1.3網(wǎng)頁(yè)頁(yè)制作軟件件7．HomeSiteAllaire的HomeSite是是一個(gè)小巧巧而全能的的HTML代碼編輯輯器，有豐豐富的幫助助功能，支支持CGI和CSS等等，并并且可以直直接編輯Perl程程序。HomeSite工作界面面繁簡(jiǎn)由人人，根據(jù)習(xí)習(xí)慣，可以以將其設(shè)置置成像Notepad那樣簡(jiǎn)簡(jiǎn)單的編輯輯窗口，也也可以在復(fù)復(fù)雜的界面面下工作。。HomeSite具具有良好的的站點(diǎn)管理理功能，鏈鏈接確認(rèn)向向?qū)Э梢詸z檢查一個(gè)或或多個(gè)文檔檔的鏈接狀狀況。HomeSite適合合那些比較較復(fù)雜和精精彩頁(yè)面的的設(shè)計(jì)。9.1網(wǎng)網(wǎng)站設(shè)計(jì)計(jì)基本知識(shí)識(shí)9.1.3網(wǎng)頁(yè)頁(yè)制作軟件件8．HotMetalProHotMetal既既提供“所所見(jiàn)即所得得”圖形制制作方式，，又提供代代碼編輯方方式，是個(gè)個(gè)令各層次次設(shè)計(jì)者都都不至于失失望的軟件件。但是初初學(xué)者需要要熟知HTML，才才能得心應(yīng)應(yīng)手地使用用這個(gè)軟件件。HotMetal具具有強(qiáng)大的的數(shù)據(jù)嵌入入能力，利利用它的數(shù)數(shù)據(jù)插入向向?qū)?，可以以把外部的的Access、Word、、Excel以及其其他ODBC數(shù)據(jù)，，放入頁(yè)面面中，而且且能夠把它它們自動(dòng)轉(zhuǎn)轉(zhuǎn)換為HTML格式式，此外它它還能轉(zhuǎn)換換很多老格格式的文檔檔（如WordStar等）），并能在在轉(zhuǎn)換過(guò)程程中把這些些文檔里的的圖片自動(dòng)動(dòng)轉(zhuǎn)換為GIF格式式。HotMetal為用戶戶提供了很很多工具，，還可以用用網(wǎng)狀圖或或樹(shù)狀圖表表現(xiàn)整個(gè)站站點(diǎn)文檔的的鏈接狀況況。9.1網(wǎng)網(wǎng)站設(shè)計(jì)計(jì)基本知識(shí)識(shí)9.1.4HTML語(yǔ)言言HTML語(yǔ)語(yǔ)言是網(wǎng)頁(yè)頁(yè)制作的基基礎(chǔ)。雖然然現(xiàn)在有許許多所見(jiàn)即即所得的網(wǎng)網(wǎng)頁(yè)制作工工具，但還還是有必要要了解一些些HTML的語(yǔ)法。。這樣，可可以更精確確的控制頁(yè)頁(yè)面的排版版，可以實(shí)實(shí)現(xiàn)更多的的功能。HTML不不是程序語(yǔ)語(yǔ)言，它只只是標(biāo)識(shí)語(yǔ)語(yǔ)言，格式式非常簡(jiǎn)單單，只是由由文字及標(biāo)標(biāo)簽組合而而成，可直直接使用普普通的文本本編輯器進(jìn)進(jìn)行編輯。。9.1網(wǎng)網(wǎng)站設(shè)計(jì)計(jì)基本知識(shí)識(shí)9.1.4HTML語(yǔ)言言1．標(biāo)簽（（tag））寫法標(biāo)簽又稱標(biāo)標(biāo)識(shí)或標(biāo)記記，在HTML中，，用來(lái)界定定各種單元元，如標(biāo)題題、段落、、列表等。。HTML單元由三三部分組成成：起始標(biāo)標(biāo)簽、單元元內(nèi)容、結(jié)結(jié)束標(biāo)簽。。起始標(biāo)簽簽由“<””和“>””來(lái)界定，，結(jié)束標(biāo)簽簽由“</”和“>”來(lái)界定定，單元名名稱和屬性性由起始標(biāo)標(biāo)簽給出。。超文本標(biāo)簽簽用尖括號(hào)號(hào)“<”和和“>”表表示標(biāo)簽名與““<”不能能留有空白白字符。有些標(biāo)簽要要加上參數(shù)數(shù)（或稱屬屬性）。超文本標(biāo)簽簽一般是成成對(duì)出現(xiàn)，，用帶斜杠杠的元素表表示結(jié)束，，有些標(biāo)簽簽只有起始始標(biāo)簽而沒(méi)沒(méi)有結(jié)束標(biāo)標(biāo)簽，還有有些標(biāo)簽可可以省略。。參數(shù)只可可加于起始始標(biāo)簽中。。標(biāo)簽字母大大小寫皆可可。一個(gè)標(biāo)簽元元素可寫在在多行，參參數(shù)位置不不受限制。。9.1網(wǎng)網(wǎng)站設(shè)計(jì)計(jì)基本知識(shí)識(shí)9.1.4HTML語(yǔ)言言2．HTML語(yǔ)言言的結(jié)構(gòu)一個(gè)HTML文件應(yīng)應(yīng)具有下面面的結(jié)構(gòu)：：<HTML> HTML文件件開(kāi)始<HEAD>文文件頭開(kāi)始始..</HEAD>文文件頭結(jié)束束<BODY> 文件件體開(kāi)始..</BODY>文文件體結(jié)結(jié)束</HTML>HTML文文件結(jié)束9.1網(wǎng)網(wǎng)站設(shè)計(jì)計(jì)基本知識(shí)識(shí)9.1.4HTML語(yǔ)言言3．基本標(biāo)標(biāo)簽的使用用（1）HTML標(biāo)簽簽<HTML>這個(gè)標(biāo)簽告告訴瀏覽器器在<HTML>……</HTML>之間的的文件是用用HTML編寫的文文檔。（2）文檔檔頭標(biāo)簽<HEAD><HEAD>…</HEAD>之之間包含的的是HTML文檔名名稱。（3）文檔檔名稱標(biāo)簽簽<TITLE><TITLE>……</TITLE>之間包包含的是具具體的HTML文檔檔名稱，字字符數(shù)通常常不超過(guò)64。（4）正文文標(biāo)簽<BODY><BODY>…</BODY>之之間是正文文部分，這這是HTML文檔最最多的部分分，它包含含的是顯示示在瀏覽器器文本窗口口中的文檔檔內(nèi)容。9.1網(wǎng)網(wǎng)站設(shè)計(jì)計(jì)基本知識(shí)識(shí)9.1.4HTML語(yǔ)言言3．．基基本本標(biāo)標(biāo)簽簽的的使使用用（5））標(biāo)標(biāo)題題（（Heading））標(biāo)標(biāo)簽簽<Hn>HTML定定義義了了6個(gè)個(gè)等等級(jí)級(jí)的的標(biāo)標(biāo)題題標(biāo)標(biāo)簽簽，，其其中中n＝＝1，，2，，……，，6。。<Hn>……</Hn>之之間間包包含含的的是是第第n級(jí)級(jí)標(biāo)標(biāo)題題。。（6）段落（（Paragraph））標(biāo)簽<P><P>…</P>之之間包含的是是一段文本。。HTML中中沒(méi)有使用硬硬換行（carriagereturn）來(lái)來(lái)分段落，也也不承認(rèn)多個(gè)個(gè)連續(xù)的空格格，這是與字字處理軟件不不同的。在HTML文檔檔中，<P>和</P>之間不論有有多少行，不不論每一行有有多長(zhǎng)或者多多短，也不論論其間有多少少個(gè)空格，瀏瀏覽器都把它它作為一個(gè)段段落來(lái)處理。。9.1網(wǎng)網(wǎng)站設(shè)計(jì)基本本知識(shí)9.1.4HTML語(yǔ)言3．基本標(biāo)簽簽的使用（7）列表標(biāo)標(biāo)簽<UL>、<OL>和<LI>HTML支持持無(wú)編號(hào)列表表和有編號(hào)列列表，而且還還可以在列表表中嵌套列表表。<UL>……</UL>表示標(biāo)簽簽之間的列表表項(xiàng)目是無(wú)編編號(hào)列表（UnnumberedList））。<OL>……</OL>表示標(biāo)簽簽之間的列表表項(xiàng)目是有編編號(hào)列表（OrderedList）。<LI>表示示標(biāo)簽后面的的內(nèi)容是具體體的列表項(xiàng)目目（ListItem）。（8）定義列列表標(biāo)簽<DL>、<DT>和<DD>定義列表有三三個(gè)標(biāo)簽。<DL>表示示定義列表（（DefinitionLists）<DT>表示示后面的項(xiàng)是是定義術(shù)語(yǔ)（（DefinitionTerm）<DD>表示示后面的項(xiàng)是是定義釋義（（DefinitionDefinition）9.1網(wǎng)網(wǎng)站設(shè)計(jì)基本本知識(shí)9.1.4HTML語(yǔ)言3．基本標(biāo)簽簽的使用（9）預(yù)格式式文本（PreformattedText）標(biāo)簽<PRE>用于產(chǎn)生固定定寬度的字符符。在<PRE>…</PRE>之間的的空格、新行行、空行和表表格與HTML源文檔中中的一致。（10）擴(kuò)展展引用（ExtendedQuotations）標(biāo)簽簽<BLOCKQUOTE><BLOCKQUOTE>…</BLOCKQUOTE>用來(lái)包包含一個(gè)比較較長(zhǎng)的引用語(yǔ)語(yǔ)。（11）強(qiáng)制制換行標(biāo)簽<BR>使用<BR>標(biāo)簽可強(qiáng)制制文本換行，，但不在行與與行之間增加加空白。9.1網(wǎng)網(wǎng)站設(shè)計(jì)基本本知識(shí)9.1.4HTML語(yǔ)言3．基本標(biāo)簽簽的使用（12）表單單標(biāo)簽<FORM>用來(lái)收集用戶戶的信息，它它可以包含讓讓用戶輸入文文本和選擇項(xiàng)項(xiàng)目的接口構(gòu)構(gòu)件，例如文文本域、按鈕鈕、復(fù)選框（（checkboxe）），單選按鈕鈕（radiobutton）和和選擇列表。。使用<FORM>標(biāo)簽時(shí)時(shí)需要注意：：①在表單中的的每個(gè)接口構(gòu)構(gòu)件必須和輸輸入標(biāo)簽（<INPUT>）或者選選擇標(biāo)簽（<SELECTION>）一起定義義；②單中的所有有構(gòu)件必須在在<FORM>…</FORM>之之間定義。9.1網(wǎng)網(wǎng)站設(shè)計(jì)基本本知識(shí)9.1.4HTML語(yǔ)言3．基本標(biāo)簽簽的使用（13）橫線線（HorizontalRule）標(biāo)簽<HR>生成一條用于于分割文檔的的水平線，其其長(zhǎng)度與瀏覽覽器窗口等寬寬，粗細(xì)和長(zhǎng)長(zhǎng)短都可設(shè)置置。（14）嵌入入圖像標(biāo)簽<IMGsrc="image-url">如<IMGsrc="image-url">或<IMGsrc="image-urd"alt="Text">，，image-url是是圖像文件的的URL。目目前，大部分分瀏覽器支持持.GIF和.JPEG文件件。alt屬屬性告訴不支支持圖圖像的的瀏覽器用Text代替替該圖。9.1網(wǎng)網(wǎng)站設(shè)計(jì)基本本知識(shí)9.1.4HTML語(yǔ)言3．基基本標(biāo)標(biāo)簽的的使用用（15）表表格標(biāo)標(biāo)簽<TABLE>表格的的基本本形式式：一一個(gè)表表由<TABLE>開(kāi)始始，</TABLE>結(jié)結(jié)束，，表的的內(nèi)容容由<TR>,<TH>和<TD>定定義。。<TR>說(shuō)明明表的的一個(gè)個(gè)行，，表有有多少少行就就有多多少個(gè)個(gè)<TR>；<TH>說(shuō)說(shuō)明表表的列列數(shù)和和相應(yīng)應(yīng)欄目目的名名稱，，有多多少個(gè)個(gè)欄就就有多多少個(gè)個(gè)<TH>；<TD>則則填充充由<TR>和和<TH>組成成的表表格。。是否否用表表格線線分開(kāi)開(kāi)為部部分內(nèi)內(nèi)容用用border屬性性說(shuō)明明。9.1網(wǎng)網(wǎng)站站設(shè)計(jì)計(jì)基本本知識(shí)識(shí)9.1.4HTML語(yǔ)言言4．常常用HTML標(biāo)標(biāo)簽（1））基本本標(biāo)簽簽（2））標(biāo)題題標(biāo)簽簽（3））文檔檔整體體屬性性（4））文本本標(biāo)簽簽（5））鏈接接（6））格式式排版版（7））圖形形元素素（8））表格格（9））表格格屬性性（10）框框架（11）框框架屬屬性（12）表表單9.1網(wǎng)網(wǎng)站站設(shè)計(jì)計(jì)基本本知識(shí)識(shí)9.1.5Dreamweaver介介紹1．Dreamweaver簡(jiǎn)介介Dreamweaver是當(dāng)當(dāng)前最最流行行的網(wǎng)網(wǎng)頁(yè)設(shè)設(shè)計(jì)軟軟件。。它與與同為為Macromedia公司司出品品的Fireworks和Flash一道道，被被譽(yù)為為網(wǎng)頁(yè)頁(yè)制作作三劍劍客。。MacromediaDreamweaverMX是是一一款款專專業(yè)業(yè)的的HTML編編輯輯器器，，用用于于對(duì)對(duì)Web站站點(diǎn)點(diǎn)、、Web頁(yè)頁(yè)和和Web應(yīng)應(yīng)用用程程序序進(jìn)進(jìn)行行設(shè)設(shè)計(jì)計(jì)、、編編碼碼和和開(kāi)開(kāi)發(fā)發(fā)。。無(wú)無(wú)論論愿愿意意享享受受手手工工編編寫寫HTML代代碼碼時(shí)時(shí)的的駕駕馭馭感感還還是是偏偏愛(ài)愛(ài)在在可可視視化化編編輯輯環(huán)環(huán)境境中中工工作作，，Dreamweaver都都會(huì)會(huì)提提供供有有用用的的工工具具。。9.1網(wǎng)網(wǎng)站站設(shè)設(shè)計(jì)計(jì)基基本本知知識(shí)識(shí)9.1.5Dreamweaver介介紹紹1．．Dreamweaver簡(jiǎn)簡(jiǎn)介介利用Dreamweaver中的的可視化化編輯功功能，可可以快速速地創(chuàng)建建頁(yè)面而而無(wú)須編編寫任何何代碼。?？梢圆椴榭此杏姓军c(diǎn)元元素或資資源并將將它們從從易于使使用的面面板直接接拖到文文檔中。?？梢栽谠贛acromediaFireworks或或其他他圖形應(yīng)應(yīng)用程序序中創(chuàng)建建和編輯輯圖像，，然后將將它們直直接導(dǎo)入入Dreamweaver，，或者添添加MacromediaFlash對(duì)對(duì)象，，從而優(yōu)優(yōu)化開(kāi)發(fā)發(fā)工作流流程。9.1網(wǎng)網(wǎng)站站設(shè)計(jì)基基本知識(shí)識(shí)9.1.5Dreamweaver介介紹2．DreamweaverMX操作界界面插入面板板文檔工具箱網(wǎng)頁(yè)設(shè)計(jì)區(qū)屬性區(qū)面板組9.1網(wǎng)網(wǎng)站站設(shè)計(jì)基基本知識(shí)識(shí)9.1.5Dreamweaver介介紹2．DreamweaverMX操作界界面DreamweaverMX操作作界面主主要的構(gòu)構(gòu)成元素素：菜單區(qū)和其他的的軟件一一樣，該該軟件所所有的操操作命令令都可以以從這一一個(gè)區(qū)內(nèi)內(nèi)找到，，例如，，選中菜菜單“編編輯”中中的“首首選參數(shù)數(shù)”，或或按快快捷鍵CTRL+U，，可以把把自己的的DreamweaverMX設(shè)設(shè)置為““設(shè)計(jì)者者”或““代碼編編寫者””工作作區(qū)布局局風(fēng)格。。9.1網(wǎng)網(wǎng)站站設(shè)計(jì)基基本知識(shí)識(shí)9.1.5Dreamweaver介介紹2．DreamweaverMX操作界界面DreamweaverMX操作作界面主主要的構(gòu)構(gòu)成元素素：插入項(xiàng)目目選擇工工具插入項(xiàng)目目選擇工工具又稱稱“對(duì)象象面板””或“插插入面板板”，在在插入面面板選中中了某個(gè)個(gè)圖標(biāo)，，可在頁(yè)頁(yè)面中的的插入相相應(yīng)項(xiàng)目目。點(diǎn)擊擊向下按按鈕在下下拉菜單單中可選選擇各類類項(xiàng)目圖圖標(biāo)，若若選擇““顯示為為制表符符”，本本面板顯顯示為另另一種形形式。9.1網(wǎng)網(wǎng)站設(shè)計(jì)基本本知識(shí)9.1.5Dreamweaver介紹2．DreamweaverMX操作界面DreamweaverMX操作作界面主要的的構(gòu)成元素：：文檔工具欄文檔工具欄可可將網(wǎng)頁(yè)設(shè)計(jì)計(jì)區(qū)快速切換換為“代碼視視圖”、“設(shè)設(shè)計(jì)視圖”、、“拆分視圖圖”。工具欄欄中還包含一一些與查看文文檔、在本地地和遠(yuǎn)程站點(diǎn)點(diǎn)間傳輸文檔檔有關(guān)的常用用命令和選項(xiàng)項(xiàng)。網(wǎng)頁(yè)設(shè)計(jì)區(qū)你所設(shè)計(jì)的網(wǎng)網(wǎng)頁(yè)或代碼將將出現(xiàn)在該區(qū)區(qū)。屬性區(qū)屬性區(qū)也成為為屬性面板，，在該區(qū)可以以對(duì)選中的對(duì)對(duì)象進(jìn)行一些些設(shè)置，選擇擇不同的網(wǎng)頁(yè)頁(yè)元素，屬性性面板所顯示示的內(nèi)容也有有所不同。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.1了了解用DreamweaverMX2004制作網(wǎng)頁(yè)頁(yè)1.設(shè)計(jì)簡(jiǎn)單單的主頁(yè)通過(guò)一個(gè)實(shí)例例頁(yè)面的制作作過(guò)程，我們們可以熟悉新新建文檔、插插入內(nèi)容、設(shè)設(shè)置頁(yè)面屬性性、保存、預(yù)預(yù)覽等基本功功能。首先，，在硬硬盤上上建立立一個(gè)個(gè)文件件夾，，再在在其中中建立立一個(gè)個(gè)命名名為images的的子文文件夾夾，另另準(zhǔn)備備兩幅幅要置置入網(wǎng)網(wǎng)頁(yè)中中的圖圖像文文件，，復(fù)制制到images子子文件件夾。。本例例中的的兩幅幅圖分分別為為L(zhǎng)ogo1_1.jpg和和Welcome.gif，，圖像像大小小分別別為356×80象象素和和600××300象象素。。9.2用用DreamweaverMX2004設(shè)計(jì)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.1了解解用DreamweaverMX2004制作作網(wǎng)頁(yè)頁(yè)1.設(shè)設(shè)計(jì)簡(jiǎn)簡(jiǎn)單的的主頁(yè)頁(yè)（1））啟動(dòng)動(dòng)DreamweaverMX2004，，選擇擇“文文件””→““新建建”命命令，，新建建一個(gè)個(gè)文檔檔。出出現(xiàn)新新建文文檔對(duì)對(duì)話框框。選擇基基本頁(yè)頁(yè)的HTML并并單擊擊“創(chuàng)創(chuàng)建””按鈕鈕，創(chuàng)創(chuàng)建一一個(gè)默默認(rèn)的的空白白頁(yè)。。9.2用用DreamweaverMX2004設(shè)計(jì)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.1了解解用DreamweaverMX2004制作作網(wǎng)頁(yè)頁(yè)1.設(shè)設(shè)計(jì)簡(jiǎn)簡(jiǎn)單的的主頁(yè)頁(yè)（2））選擇擇“文文件””→““另存存為””命令令，將將文件件路徑徑指定定為前前面建建立的的文件件夾，，給文文件起起一個(gè)個(gè)名字字index.htm。。在進(jìn)行行具體體制作作之前前，我我們點(diǎn)點(diǎn)擊文文檔工工具欄欄的代代碼按按鈕或或拆分分按鈕鈕，可可以看看到Dreamweaver為這這個(gè)空空文件件生成成的HTML代代碼。。9.2用用DreamweaverMX2004設(shè)計(jì)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.1了解解用DreamweaverMX2004制作作網(wǎng)頁(yè)頁(yè)1.設(shè)設(shè)計(jì)計(jì)簡(jiǎn)簡(jiǎn)單單的的主主頁(yè)頁(yè)（5））點(diǎn)點(diǎn)擊擊屬屬性性面面板板下下面面的的““頁(yè)頁(yè)面面屬屬性性””按按鈕鈕或或選選擇擇““修修改改””→→““頁(yè)頁(yè)面面屬屬性性””命命令令，，打打開(kāi)開(kāi)““頁(yè)頁(yè)面面屬屬性性””對(duì)對(duì)話話框框。。在頁(yè)頁(yè)面面屬屬性性對(duì)對(duì)話話框框中中將將背背景景顏顏色色設(shè)設(shè)置置為為f9b779，，頁(yè)頁(yè)面面字字體體保保持持默默認(rèn)認(rèn)字字體體，，大大小小設(shè)設(shè)為為12像像素素，，左左邊邊距距、、右右邊邊距距、、上上邊邊距距和和下下邊邊距距均均設(shè)設(shè)為為0。。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)計(jì)站站點(diǎn)點(diǎn)網(wǎng)網(wǎng)頁(yè)頁(yè)9.2.1了了解解用用DreamweaverMX2004制制作作網(wǎng)網(wǎng)頁(yè)頁(yè)1.設(shè)設(shè)計(jì)計(jì)簡(jiǎn)簡(jiǎn)單單的的主主頁(yè)頁(yè)（6））在在““插插入入對(duì)對(duì)象象面面板板””的的常常用用類類中中單單擊擊圖圖像像圖圖標(biāo)標(biāo)，，在在““選選擇擇圖圖像像源源文文件件””對(duì)對(duì)話話框框中中選選擇擇images文文件件夾夾中中的的Logo1_1.jpg。。插插入入圖圖像像后后鼠鼠標(biāo)標(biāo)點(diǎn)點(diǎn)擊擊圖圖像像右右側(cè)側(cè)使使光光標(biāo)標(biāo)移移到到圖圖像像右右邊邊，，多多次次按按回回車車將將光光標(biāo)標(biāo)定定位位在在合合適適位位置置，，用用同同樣樣方方法法將將圖圖像像Welcome.gif插插入入到到頁(yè)頁(yè)面面。。（7）在編輯輯過(guò)程中可以以隨時(shí)在瀏覽覽器中預(yù)覽以以確定效果，，按鍵盤上F12鍵或點(diǎn)點(diǎn)擊Dreamweaver中文檔檔工具欄中預(yù)預(yù)覽按鈕之后后選“預(yù)覽在在iexplore”，，可以在瀏覽覽器中察看我我們制作的網(wǎng)網(wǎng)頁(yè)結(jié)果。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.1了了解用DreamweaverMX2004制作網(wǎng)頁(yè)頁(yè)1.設(shè)計(jì)簡(jiǎn)單單的主頁(yè)9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.1了了解用DreamweaverMX2004制作網(wǎng)頁(yè)頁(yè)1.設(shè)計(jì)簡(jiǎn)單單的主頁(yè)（8）回到Dreamweave，，點(diǎn)擊選中下下面一幅圖像像Welcome.gif，在下面面的“屬性面面板”中可以以調(diào)整其在HTML文檔檔中的屬性。。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.1了了解用DreamweaverMX2004制作網(wǎng)頁(yè)頁(yè)1.設(shè)計(jì)簡(jiǎn)單單的主頁(yè)（9）點(diǎn)擊右右面的居中對(duì)對(duì)齊按鈕使得得圖像在顯示示時(shí)處于頁(yè)面面中央，設(shè)置置“邊框”值值為0。（10）在設(shè)設(shè)計(jì)窗口點(diǎn)擊擊圖像右邊區(qū)區(qū)域并按回車車使光標(biāo)移到到圖像下方，，輸入文字““歡迎！點(diǎn)擊擊進(jìn)入...”。拖動(dòng)鼠鼠標(biāo)選中剛才才輸入的文字字，在“屬性性面板”中改改為居中對(duì)齊齊。（11）為建建立鏈接，新新建一個(gè)HTML文檔取取名為Homepage.htm，，保存并關(guān)閉閉該文檔。（12）回到到index.htm，，點(diǎn)擊選中圖圖像Welcome.gif，在屬屬性面板中點(diǎn)點(diǎn)擊“鏈接編編輯框”后面面的瀏覽文件件圖標(biāo)，在彈彈出的“選擇擇文件對(duì)話框框”中選擇Homepage.htm。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.1了解用DreamweaverMX2004制作作網(wǎng)頁(yè)1.設(shè)計(jì)簡(jiǎn)簡(jiǎn)單的主頁(yè)頁(yè)（13）拖拖動(dòng)鼠標(biāo)選選擇文字““歡迎！點(diǎn)點(diǎn)擊進(jìn)入...”，，以同樣方方法建立鏈鏈接到Homepage.htm。在在瀏覽器中中察看網(wǎng)頁(yè)頁(yè)的實(shí)際效效果，點(diǎn)擊擊網(wǎng)頁(yè)中下下方的圖像像或文字，，可以鏈接接到另一頁(yè)頁(yè)。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.1了解用DreamweaverMX2004制作作網(wǎng)頁(yè)1.設(shè)計(jì)簡(jiǎn)簡(jiǎn)單的主頁(yè)頁(yè)（14）回回到Dreamweave，，保存剛才才設(shè)計(jì)的網(wǎng)網(wǎng)頁(yè)。至此完成本本頁(yè)面的制制作，點(diǎn)擊擊代碼按鈕鈕可以看到到Dreamweaver生生成的HTML代碼碼。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.1了解用DreamweaverMX2004制作作網(wǎng)頁(yè)1.設(shè)計(jì)簡(jiǎn)簡(jiǎn)單的主頁(yè)頁(yè)為了不影響響網(wǎng)頁(yè)的下下載速度，，圖像要用用得少而精精，使用圖圖像處理軟軟件在不失失真的情況況下盡量壓壓縮。瀏覽器能識(shí)識(shí)別的圖像像有jpg（jpeg）、gif、png和bmp等，，Dreamweaver能能較好支持持的有jpg、gif和png。目前網(wǎng)上用用的最多的的是jpg和gif，因?yàn)檫@這兩種格式式文件體積積較小。Gif格式式的圖像用用工具處理理后能去掉掉本身的背背景，而很很好地和頁(yè)頁(yè)面融合，，還能做成成動(dòng)畫(huà)。在Dreamweaver中中選中網(wǎng)頁(yè)頁(yè)中的圖像像后，可使使用“屬性性面板”調(diào)調(diào)整其在網(wǎng)網(wǎng)頁(yè)中的屬屬性。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.1了解用DreamweaverMX2004制作作網(wǎng)頁(yè)2．站點(diǎn)管管理用Dreamweaver制制作網(wǎng)頁(yè)，，為了以后后的方便，，最好首先先定義一個(gè)個(gè)本地站點(diǎn)點(diǎn)。其實(shí)，，使用網(wǎng)頁(yè)頁(yè)編輯器比比起直接手手寫代碼最最大的優(yōu)勢(shì)勢(shì)就在于站站點(diǎn)管理。。用Dreamweaver，可以很很方便的對(duì)對(duì)站點(diǎn)內(nèi)文文件進(jìn)行改改名或刪除除操作，其其站點(diǎn)管理理能自動(dòng)修修改其他頁(yè)頁(yè)面指向這這個(gè)文件的的鏈接。使使用Dreamweaver的模版和和庫(kù)，可讓讓站點(diǎn)內(nèi)的的部分頁(yè)面面共用相同同的部分，，還可方便便的統(tǒng)一更更新。Dreamweaver還自帶帶FTP功功能，可進(jìn)進(jìn)行遠(yuǎn)程管管理。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.1了解用DreamweaverMX2004制作作網(wǎng)頁(yè)2．站點(diǎn)管管理（1）要新新建一個(gè)本本地站點(diǎn)，，需點(diǎn)擊Dreamweaver菜單單欄的“站站點(diǎn)”→““管理站點(diǎn)點(diǎn)”命令，，彈出“管管理站點(diǎn)””對(duì)話框。。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.1了解用DreamweaverMX2004制作作網(wǎng)頁(yè)2．站點(diǎn)管管理（2）單擊擊“新建””按鈕，彈彈出“站點(diǎn)點(diǎn)定義”對(duì)對(duì)話框，在在基本頁(yè)填填入你給這這個(gè)站點(diǎn)的的命名。在在對(duì)話框““高級(jí)”頁(yè)頁(yè)“本地根根文件夾””設(shè)置這個(gè)個(gè)站點(diǎn)在本本地所在的的文件夾，，用以模擬擬本地站點(diǎn)點(diǎn)的根目錄錄。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.1了解用DreamweaverMX2004制作作網(wǎng)頁(yè)2．站點(diǎn)管管理（3）選中中“自動(dòng)刷刷新本地文文件列表””前的選框框，則將來(lái)來(lái)當(dāng)有新的的文件復(fù)制制到本地文文件夾時(shí)，，Dreamweaver將將對(duì)這個(gè)本本地站點(diǎn)的的目錄列表表自動(dòng)更新新。（4）在HTTP地地址后可以以填入這個(gè)個(gè)站點(diǎn)的網(wǎng)網(wǎng)址。（5）選中中“啟用緩緩存”復(fù)選選框，則Dreamweaver會(huì)給給這個(gè)本地地站點(diǎn)設(shè)置置一個(gè)緩存存，以提高高站點(diǎn)管理理的速度。。（6）設(shè)設(shè)置完畢畢后，點(diǎn)點(diǎn)擊“確確定”按按鈕，完完成本地地站點(diǎn)設(shè)設(shè)置。9.2用用DreamweaverMX2004設(shè)計(jì)站站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.1了解解用DreamweaverMX2004制制作網(wǎng)頁(yè)頁(yè)2．站點(diǎn)點(diǎn)管理準(zhǔn)備三幅幅圖把它它們存入入images文件夾夾。Logobar.jpg圖圖像大大小為760××80像像素；Menubar.jpg760××20像像素9.2用用DreamweaverMX2004設(shè)計(jì)站站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.1了解解用DreamweaverMX2004制制作網(wǎng)頁(yè)頁(yè)2．站點(diǎn)點(diǎn)管理Left1_03.gif152×363像像素9.2用用DreamweaverMX2004設(shè)計(jì)站站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.1了解解用DreamweaverMX2004制制作網(wǎng)頁(yè)頁(yè)2．站點(diǎn)點(diǎn)管理在“文件件面板””文件列列表上的的上一節(jié)節(jié)建立的的空文件件Homepage.htm上點(diǎn)右右鍵，選選“打開(kāi)開(kāi)”，打打開(kāi)Homepage.htm文檔檔，也可可在文件件列表雙雙擊打開(kāi)開(kāi)該文件件，“文文件面板板”文件件列表上上展開(kāi)images文文件夾，，拖動(dòng)圖圖像Logobar.jpg到設(shè)計(jì)計(jì)視圖，，把光標(biāo)標(biāo)移到圖圖像右側(cè)側(cè)再按鍵鍵盤上““Shift””+“回回車”鍵鍵，把Menubar.jpg拖過(guò)過(guò)來(lái)，再再把光標(biāo)標(biāo)移到右右側(cè)按鍵鍵盤上““Shift””+“回回車”鍵鍵，用同同樣方法法拖入圖圖像Left1_03.gif，設(shè)設(shè)置文檔檔的標(biāo)題題為“風(fēng)風(fēng)箏網(wǎng)站站”，保保存該網(wǎng)網(wǎng)頁(yè)。9.2用用DreamweaverMX2004設(shè)計(jì)站站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.1了解解用DreamweaverMX2004制制作網(wǎng)頁(yè)頁(yè)2．站點(diǎn)點(diǎn)管理按F12鍵在瀏瀏覽器中中預(yù)覽結(jié)結(jié)果9.2用用DreamweaverMX2004設(shè)計(jì)站站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.2文文本編編輯MacromediaDreamweaverMX2004提提供了了多種向向文檔中中添加文文本和設(shè)設(shè)置文本本格式的的方法。?？梢圆宀迦胛谋颈?、設(shè)置置字體類類型、大大小、顏顏色和對(duì)對(duì)齊屬性性，以及及使用層層疊樣式式表（CSS））樣式式創(chuàng)建和和應(yīng)用自自己的自自定義樣樣式。Dreamweaver允許許通過(guò)以以下方式式在Web頁(yè)頁(yè)中添加加文本：：直接將將文本鍵鍵入頁(yè)中中，從其其他文檔檔復(fù)制和和粘貼文文本，或或從其他他應(yīng)用程程序拖放放文本。。Web專業(yè)業(yè)人員接接受的、、包含能能夠合并并到Web頁(yè)頁(yè)的文本本內(nèi)容的的常見(jiàn)文文檔類型型有ASCII文本本文件、、RTF文件件和MSOffice文文檔。Dreamweaver可以以從這些些文檔類類型中的的任何一一種取出出文本，，然后將將文本并并入Web頁(yè)頁(yè)中。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.2文文本編輯輯（1）打開(kāi)前前面建好的網(wǎng)網(wǎng)頁(yè)Homepage.htm。選選中圖像Left1_03.gif，在“屬性性面板”對(duì)齊齊下拉菜單中中選左對(duì)齊齊，光標(biāo)在Left1_03.gif右側(cè)，輸輸入一段文字字。（2）使用““屬性面板””或“文本””菜單中的選選項(xiàng)可以設(shè)置置或更改所選選文本的字體體特性?？梢砸栽O(shè)置字體類類型、樣式（（如粗體或斜斜體）和大小小。（3）選中要要編輯的文字字，利用“屬屬性面版”進(jìn)進(jìn)行文本屬性性編輯。（4）保存設(shè)設(shè)計(jì)的網(wǎng)頁(yè)。。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.3頁(yè)頁(yè)面布局局1．使用表格格控制頁(yè)面布布局頁(yè)面元素的布布局和定位并并不能隨心所所欲排版，借借助表格，可可實(shí)現(xiàn)所設(shè)想想的任何排版版效果。也可可靈活使用表表格的背景、、框線等作出出較美觀的效效果。表格是用于在在HTML頁(yè)頁(yè)上顯示表表格式數(shù)據(jù)以以及對(duì)文本和和圖形進(jìn)行布布局的強(qiáng)有力力的工具。表表格由一行或或多行組成；；每行又由一一個(gè)或多個(gè)單單元格組成。。雖然HTML代碼中中通常不明確確指定列，但但Dreamweaver允許操操作列、行和和單元格。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.3頁(yè)頁(yè)面布局局1．使用表格格控制頁(yè)面布布局（1）打開(kāi)網(wǎng)網(wǎng)頁(yè)文檔Homepage.htm，拖動(dòng)鼠標(biāo)標(biāo)選中頁(yè)面中中所有圖像和和文字，按Delete鍵刪除。在在“頁(yè)面屬性性”中設(shè)置頁(yè)頁(yè)面背景色為為#7799ca，頁(yè)面面字體大小為為12像素。。在“文檔工工具欄”中輸輸入頁(yè)面標(biāo)題題為“風(fēng)箏文文化”。在““插入面版””的“通用””組中點(diǎn)擊表表格圖標(biāo)，彈彈出“表格””對(duì)話框。。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.3頁(yè)頁(yè)面布局局1．使用表格格控制頁(yè)面布布局（2）設(shè)置““行數(shù)”：2，“列數(shù)””：1，“表表格寬度”：：760像素素，“邊框?qū)拰挾取保?像像素，“單元元格邊距”：：5，“單元元格間距”：：5，確定。。（3）點(diǎn)擊擊表格第一一行單元格格定位光標(biāo)標(biāo)，插入圖圖像Logobar.jpg。（4）在第第二行單元元格中插入入圖像Menubar.jpg。（5）點(diǎn)擊擊表格內(nèi)上上方區(qū)域，，在工作區(qū)區(qū)下方選擇擇要選定的的內(nèi)容，點(diǎn)點(diǎn)擊<table>選定整個(gè)個(gè)表格，在在“屬性面面板”中調(diào)調(diào)整表格屬屬性。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.3頁(yè)面面布局2．表格的的嵌套（1）在Dreamweaver中，，選定整個(gè)個(gè)表格，選選擇“編輯輯”→“剪剪貼”命令令，在“插插入面版””的“通用用”組中點(diǎn)點(diǎn)擊表格圖圖標(biāo)，再次次建立表格格，設(shè)置““行數(shù)”：：2，“列列數(shù)”：1，“表格格寬度”：：760像像素，“邊邊框?qū)挾取薄保?像素素，“單元元格邊距””：0，““單元格間間距”：0。（2）點(diǎn)擊擊表格第一一行標(biāo)單元元格定位光光標(biāo)，選擇擇“編輯””→“復(fù)復(fù)制”命令令。這個(gè)單單元格內(nèi)又又套入了一一個(gè)表格。。（3）點(diǎn)擊擊外層表格格中下方的的單元格，，再插入一一個(gè)表格，，參數(shù)設(shè)置置為“行數(shù)數(shù)”：1，，“列數(shù)””：2，““表格寬度度”：760像素，，“邊框?qū)拰挾取保?像素，““單元格邊邊距”：0，“單元元格間距””：0。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.3頁(yè)面面布局2．表格的的嵌套（4）點(diǎn)擊擊<table>，，選中最外外層表格。。在“屬性性面板”的的設(shè)為白色色或直接輸輸入#FFFFFF。（5）用鼠鼠標(biāo)點(diǎn)擊內(nèi)內(nèi)嵌的下面面一個(gè)表格格左側(cè)單元元格，光標(biāo)標(biāo)定位在這這個(gè)單元格格內(nèi)，點(diǎn)擊擊<td>，選中內(nèi)內(nèi)層表格第第一行的第第一個(gè)單元元格，在““屬性面板板”中設(shè)定定高度為152。設(shè)設(shè)置第二個(gè)個(gè)單元格的的對(duì)齊方式式為“頂端端”。（6）在內(nèi)內(nèi)嵌的下面面一個(gè)表格格的第一列列插入圖像像Left1_03.gif，第二列列中輸入文文本內(nèi)容并并調(diào)整文本本格式和屬屬性。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.3頁(yè)面面布局2．表格的的嵌套（4）點(diǎn)擊擊<table>，，選中最外外層表格。。在“屬性性面板”的的設(shè)為白色色或直接輸輸入#FFFFFF。（5）用鼠鼠標(biāo)點(diǎn)擊內(nèi)內(nèi)嵌的下面面一個(gè)表格格左側(cè)單元元格，光標(biāo)標(biāo)定位在這這個(gè)單元格格內(nèi)，點(diǎn)擊擊<td>，選中內(nèi)內(nèi)層表格第第一行的第第一個(gè)單元元格，在““屬性面板板”中設(shè)定定高度為152。設(shè)設(shè)置第二個(gè)個(gè)單元格的的對(duì)齊方式式為“頂端端”。（6）在內(nèi)內(nèi)嵌的下面面一個(gè)表格格的第一列列插入圖像像Left1_03.gif，第二列列中輸入文文本內(nèi)容并并調(diào)整文本本格式和屬屬性。（7）保存存設(shè)計(jì)的網(wǎng)網(wǎng)頁(yè)Homepage.htm。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.3頁(yè)面面布局3．合并或或拆分表格格單元只要整個(gè)選選擇部分的的單元格形形成一行或或一個(gè)矩形形，便可以以合并任意意數(shù)目的相相鄰的單元元格，以生生成一個(gè)跨跨多個(gè)列或或行的單元元格。可以以將單元格格拆分成任任意數(shù)目的的行或列，，而不管之之前它是否否是合并的的。Dreamweaver可以自自動(dòng)重新構(gòu)構(gòu)造表格以以創(chuàng)建指定定的排列方方式。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.3頁(yè)面面布局4．導(dǎo)入導(dǎo)導(dǎo)出可以將在另另一個(gè)應(yīng)用用程序（例例如MicrosoftExcel）中創(chuàng)建建并以分隔隔文本的格格式（其中中的項(xiàng)以制制表符、逗逗號(hào)、冒號(hào)號(hào)、分號(hào)或或其他分隔隔符隔開(kāi)））保存的表表格式數(shù)據(jù)據(jù)導(dǎo)入到Dreamweaver中中并設(shè)置為為表格的格格式。也可可以將表格格數(shù)據(jù)從Dreamweaver導(dǎo)導(dǎo)出到文本本文件中，，相鄰單元元格的內(nèi)容容由分隔符符隔開(kāi)?？煽梢允褂枚憾禾?hào)、冒號(hào)號(hào)、分號(hào)或或空格作為為分隔符。。當(dāng)導(dǎo)出表表格時(shí)，將將導(dǎo)出整個(gè)個(gè)表格，不不能選擇導(dǎo)導(dǎo)出部分表表格。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.3頁(yè)面面布局5．靈活運(yùn)運(yùn)用表格設(shè)設(shè)計(jì)精美頁(yè)頁(yè)面在Dreamweaver中中，新建一一個(gè)文檔，，用表格定定位的方法法，制作網(wǎng)網(wǎng)頁(yè)。其其中的表格格線框是使使用了一個(gè)個(gè)“背景顏顏色”為灰灰色、“間間距”為1像素的表表格，所有有單元格的的“背景顏顏色”設(shè)為為白色。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.3頁(yè)面面布局6．其他布布局方法（1）布局局模式MacromediaDreamweaverMX2004提供供了兩種查查看和操作作表格的方方式：在““標(biāo)準(zhǔn)模式式”中，表表格顯示為為行和列的的網(wǎng)格，而而“布局模模式”允許許在將表格格用作基礎(chǔ)礎(chǔ)結(jié)構(gòu)的同同時(shí)在頁(yè)面面上繪制、、調(diào)整方框框的大小以以及移動(dòng)方方框。與一般的表表格不同，，在任何一一個(gè)位置拖拖動(dòng)圖標(biāo)，，“布局模模式”都可可以自動(dòng)生生成表格和和單元格。。另外，它它能夠自由由拖動(dòng)，所所以再?gòu)?fù)雜雜的頁(yè)面布布局也可以以輕松地制制作出來(lái)。。在“布局模模式”中，，可以在添添加內(nèi)容前前使用布局局單元格和和表格來(lái)對(duì)對(duì)頁(yè)面進(jìn)行行布局。例例如，可以以沿頁(yè)的頂頂部繪制一一個(gè)單元格格放置標(biāo)題題圖形，在在頁(yè)的左邊邊繪制另一一個(gè)單元格格放置導(dǎo)航航條，在右右邊繪制第第三個(gè)單元元格放置內(nèi)內(nèi)容。添加加內(nèi)容時(shí)，，您可以按按需要在四四周移動(dòng)單單元格，以以調(diào)整布局局。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.3頁(yè)面面布局6．其他布布局方法（2）層層是用于精精確定位的的頁(yè)面元素素?？赏鶎訉永锛尤雸D圖像、文本本等其他頁(yè)頁(yè)面元素，，借助層，，可對(duì)加入入的頁(yè)面元元素進(jìn)行精精確定位，，還可做出出重疊效果果和運(yùn)動(dòng)效效果。要往往網(wǎng)網(wǎng)頁(yè)頁(yè)中中加加入入層層，，點(diǎn)點(diǎn)擊擊““插插入入面面板板””上上““布布局局””組組中中的的““描描繪繪層層””圖圖標(biāo)標(biāo)，，移移動(dòng)動(dòng)鼠鼠標(biāo)標(biāo)至至Dreamweaver主主窗窗口口，，鼠鼠標(biāo)標(biāo)即即顯顯示示成成十十字字型型。。在在窗窗口口區(qū)區(qū)域域拖拖動(dòng)動(dòng)鼠鼠標(biāo)標(biāo)即即可可畫(huà)畫(huà)出出層層。。或或者者，，點(diǎn)點(diǎn)擊擊菜菜單單欄欄的的““插插入入””→→““布布局局對(duì)對(duì)像像””→→““層層””，，主主窗窗口口即即被被加加入入一一個(gè)個(gè)層層。。點(diǎn)擊層的邊線線，即選中這這個(gè)層?？捎糜檬髽?biāo)拖動(dòng)，，將層移至頁(yè)頁(yè)面合適的位位置。用鼠標(biāo)標(biāo)拖動(dòng)邊線上上的黑色方塊塊，可調(diào)節(jié)層層的大小。用用鼠標(biāo)點(diǎn)擊擊層內(nèi)的任意意位置，這時(shí)時(shí)可往層內(nèi)加加入文本、圖圖像等內(nèi)容。。層中可再嵌嵌套層。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.3頁(yè)頁(yè)面布局局7．使用框架架框架結(jié)構(gòu)提供供將一個(gè)瀏覽覽器窗口劃分分為多個(gè)區(qū)域域、每個(gè)區(qū)域域都可以顯示示不同HTML文檔的的方法?？蚣芗芙Y(jié)構(gòu)將兩個(gè)個(gè)或兩個(gè)以上上的網(wǎng)頁(yè)頁(yè)面面組合起來(lái)，，能用同一個(gè)個(gè)瀏覽器窗口口打開(kāi)，即多多個(gè)頁(yè)面合起起來(lái)顯示成一一個(gè)頁(yè)面的效效果。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.3頁(yè)頁(yè)面布局局7．使用框架架使用框架具有有以下優(yōu)點(diǎn)：：（1）訪問(wèn)者者的瀏覽器不不需要為每個(gè)個(gè)頁(yè)面重新加加載與導(dǎo)航相相關(guān)的圖形。。能統(tǒng)一風(fēng)格格、便于制作作和修改、方方便訪問(wèn)；（2）每個(gè)框框架都具有自自己的滾動(dòng)條條（如果內(nèi)容容太大，在窗窗口中顯示不不下），因因此訪問(wèn)者可可以獨(dú)立滾動(dòng)動(dòng)這些框架。。例如，當(dāng)框框架中的內(nèi)容容頁(yè)面較長(zhǎng)時(shí)時(shí)，如果導(dǎo)航航條位于不同同的框架中，，那么向下滾滾動(dòng)到頁(yè)面底底部的訪問(wèn)者者就不需要再再滾動(dòng)回頂部部來(lái)使用導(dǎo)航航條。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.3頁(yè)面面布局7．使用框框架使用框架的的缺點(diǎn)是：：（1）可能能難以實(shí)現(xiàn)現(xiàn)不同框架架中各元素素的精確圖圖形對(duì)齊；；（2）對(duì)導(dǎo)導(dǎo)航進(jìn)行測(cè)測(cè)試可能很很耗時(shí)間；；（3）各個(gè)個(gè)帶有框架架的頁(yè)面的的URL不不顯示在在瀏覽器中中，因此訪訪問(wèn)者可能能難以將特特定頁(yè)面設(shè)設(shè)為書(shū)簽。。9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.3頁(yè)面面布局7．使用框框架（1）在Dreamweaver中，，新建一個(gè)個(gè)基本HTML文檔檔，建立一一個(gè)框架結(jié)結(jié)構(gòu)，在菜菜單“查看看”→“可可視化助理理”中確認(rèn)認(rèn)選中“框框架邊框””，在菜單單“窗口””中確認(rèn)選選中“框架架”以顯示示“框架面面板”?？蚣苊姘?.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.3頁(yè)面面布局7．使用框框架（2）用鼠鼠標(biāo)點(diǎn)擊框框線，或在在“框架面面板”點(diǎn)擊擊最外層邊邊框，選擇擇整個(gè)框架架集在“文文檔工具欄欄”的“標(biāo)標(biāo)題”后輸輸入“風(fēng)箏箏會(huì)”，選選擇“文件件”→“框框架集另存存為”命令令，保存這這個(gè)框架集集文件，命命名為page4.htm。。（3）在““框架面板板”中點(diǎn)擊擊左邊的框框體，在““屬性面板板”查看和和設(shè)置框架架屬性，可可在“源文文件”后設(shè)設(shè)置將要在在本區(qū)域顯顯示的已經(jīng)經(jīng)編輯好的的HTML頁(yè)面。我我們?cè)凇霸丛次募焙蠛笤O(shè)置為已已經(jīng)編輯好好的一個(gè)網(wǎng)網(wǎng)頁(yè)文檔page4_l.htm9.2用用DreamweaverMX2004設(shè)計(jì)站點(diǎn)點(diǎn)網(wǎng)頁(yè)9.2.3頁(yè)面面布局7．使用框框架（4）在設(shè)計(jì)計(jì)窗口中點(diǎn)擊擊某區(qū)域編輯輯修改或直接接建立HTML頁(yè)面。在右側(cè)上邊的的分欄中設(shè)計(jì)計(jì)網(wǎng)頁(yè)，編輯輯后用菜單““文件”中的的“保存框架架”或“框架架另存為”保保存為page4_t_1.htm。同樣，在在下邊的分欄欄中設(shè)計(jì)網(wǎng)頁(yè)頁(yè)并用菜單““框架另存為為”保存為為page4_1_1.htm。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.3頁(yè)頁(yè)面布局局7．使用框架架（5）在“框框架面板”點(diǎn)點(diǎn)擊最外層邊邊框，選擇整整個(gè)框架集，，在“屬性面面板”中設(shè)設(shè)置“邊框””為“否”，，意為在瀏覽覽器中不顯示示邊框。設(shè)邊邊框?qū)挾葹椤啊?”，意為為在瀏覽器中中不占用空間間。菜單“文文件”→“保保存框架頁(yè)””以保存對(duì)框框架集的修改改。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.4鏈鏈接與導(dǎo)導(dǎo)航DreamweaverMX2004提提供多種創(chuàng)建建超文本鏈接接的方法，可可創(chuàng)建到文檔檔、圖像、多多媒體文件或或可下載軟件件的鏈接?？煽梢越⒌轿奈臋n內(nèi)任意位位置的任何文文本或圖像（（包括標(biāo)題、、列表、表、、層或框架中中的文本或圖圖像）的鏈接接。若要直觀觀地查看文件件是如何鏈接接在一起的，，可使用站點(diǎn)點(diǎn)地圖。在站站點(diǎn)地圖中，，可以向站點(diǎn)點(diǎn)添加新文檔檔、創(chuàng)建和刪刪除文檔鏈接接以及檢查到到相關(guān)文件的的鏈接。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.4鏈鏈接與導(dǎo)導(dǎo)航2．客戶戶端圖像像地圖可使一個(gè)個(gè)圖像的的不同部部位分別別鏈接到到不同的的頁(yè)面，，這叫作作客戶端端圖像映映射或客客戶端圖圖像地圖圖。在圖像““屬性面面板”擴(kuò)擴(kuò)展模式式左下方方有一項(xiàng)項(xiàng)為“地地圖”，，用以進(jìn)進(jìn)行客戶戶端圖像像映射。。在其后后可填入入你為這這個(gè)映射射起的名名字，若若不填，，則Dreamweaver自動(dòng)加加上一個(gè)個(gè)名字。?！暗貓D圖”下面面有三個(gè)個(gè)圖標(biāo)，，從左到到右依次次為截取取矩形、、截取圓圓形和截截取不規(guī)規(guī)則圖形形。9.2用用DreamweaverMX2004設(shè)計(jì)站站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.4鏈鏈接與與導(dǎo)航2．客戶戶端圖像像地圖（1）打打開(kāi)前面面建立的的網(wǎng)頁(yè)Homepage.htm，，點(diǎn)擊選選中最上上面的圖圖像，在在“屬性性面板””中點(diǎn)擊擊截取矩矩形，在在圖像中中右上角角環(huán)繞““關(guān)于我我們”部部分畫(huà)一一矩形，，這個(gè)形形狀成為為“熱點(diǎn)點(diǎn)”。。（2））在“熱熱點(diǎn)”的的“屬性性面板””中給““熱點(diǎn)””設(shè)置超超級(jí)鏈接接，用同同樣方法法給右邊邊“聯(lián)系系留言””部分建建立熱點(diǎn)點(diǎn)鏈接，，在“鏈鏈接”欄欄輸入mailto：：，后面面輸入一一個(gè)Email地址。。（3）保保存文檔檔。9.2用用DreamweaverMX2004設(shè)計(jì)站站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.4鏈鏈接與與導(dǎo)航3．導(dǎo)航航條導(dǎo)航條一一般由幾幾個(gè)圖像像構(gòu)成，，點(diǎn)擊不不同的圖圖像，將將鏈接到到網(wǎng)站不不同的頁(yè)頁(yè)面。通通過(guò)統(tǒng)一一導(dǎo)航條條的方法法，我們們可以實(shí)實(shí)現(xiàn)網(wǎng)站站風(fēng)格的的統(tǒng)一，，同時(shí)也也方便了了訪問(wèn)者者在不同同頁(yè)面間間的跳轉(zhuǎn)轉(zhuǎn)。在建立導(dǎo)航條條之前，我們們先做一些準(zhǔn)準(zhǔn)備工作，使使用圖像處理理軟件，把前前面例子中的的菜單圖像Menubar.jpg切割成多塊塊，并把要在在網(wǎng)頁(yè)中建立立鏈接的每部部分圖像的背背景和文字更更換不同顏色色另存兩份9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.4鏈鏈接與導(dǎo)導(dǎo)航3．導(dǎo)航條（1）在Dreamweaver中中，刪除圖像像Menubar.jpg，加入一一個(gè)表格，在在每單元格插插入切成小塊塊的圖像，使使其看起來(lái)就就像原來(lái)的圖圖像Menubar.jpg。（2）選中有有“風(fēng)箏薈萃萃”字樣的Menubar3_1.jpg。選選擇“插入””→“圖圖像對(duì)象”→→“導(dǎo)航航條”，或在在“插入面板板”欄的“常常用”類別中中，單擊“圖圖像”菜單并并選擇“插入入導(dǎo)航條”按按鈕，打開(kāi)““插入導(dǎo)航條條”對(duì)話框。。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.4鏈鏈接與導(dǎo)導(dǎo)航3．導(dǎo)航條導(dǎo)航條項(xiàng)目有有四種狀態(tài)：：一般：用戶尚尚未單擊或尚尚未與此項(xiàng)目目交互時(shí)所顯顯示的圖像。。設(shè)為Menubar3_1.jpg?；^(guò)：指鼠標(biāo)標(biāo)指針滑過(guò)““一般”圖像像時(shí)所顯示的的圖像。項(xiàng)目目的外觀發(fā)生生變化，以便便讓用戶知道道可與這個(gè)項(xiàng)項(xiàng)目進(jìn)行交互互。設(shè)為Menubar3_2.jpg。按下：指項(xiàng)目目被單擊后所所顯示的圖像像。設(shè)為Menubar3_3.jpg。按下時(shí)鼠標(biāo)經(jīng)經(jīng)過(guò)：指在項(xiàng)項(xiàng)目被單擊后后，鼠標(biāo)指針針滑過(guò)“按下下”圖像時(shí)，，所顯示的圖圖像。是鼠標(biāo)標(biāo)點(diǎn)擊后當(dāng)鼠鼠標(biāo)再次移動(dòng)動(dòng)到這個(gè)部位位上時(shí)顯示的的圖像。可不不做設(shè)置。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.4鏈鏈接與導(dǎo)導(dǎo)航3．導(dǎo)航條（3）在“按按下時(shí)，前往往的URL””后設(shè)置要鏈鏈接的網(wǎng)頁(yè)。。設(shè)定完成后后確定。當(dāng)鼠標(biāo)移至““風(fēng)箏薈萃””時(shí)變?yōu)榘椎椎缀谧之?dāng)鼠標(biāo)在“風(fēng)風(fēng)箏薈萃”上上按下時(shí)變?yōu)闉槌鹊装鬃?.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.5其其他設(shè)計(jì)計(jì)要素1.利用最新新多媒體技術(shù)術(shù)MacromediaDreamweaverMX2004可可以迅速、、方便地向Web站點(diǎn)點(diǎn)添加聲音和和影片，可以以在Dreamweaver自身身內(nèi)插入MacromediaFlashMX2004按鈕鈕和文本對(duì)象象等。可以在在文檔中插入入：Flash和Shockwave影片片、QuickTime、AVI、、Javaapplet、ActiveX控件以及及各種格式的的音頻文件等等?？梢栽谑故褂肈reamweaver時(shí)在在文檔中創(chuàng)建建、插入和修修改Flash按鈕而而無(wú)須使用MacromediaFlash?？梢宰远ǘxFlash按鈕對(duì)對(duì)象，并添加加文本、背景景顏色以及指指向其他文件件的鏈接。Flash文文本對(duì)象允允許您創(chuàng)建和和插入只包含含文本的Flash影影片。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.5其其他設(shè)計(jì)計(jì)要素2.CSS樣式表CSS即CascadingStyleSheet或或樣式表，是是可以定義HTML標(biāo)簽簽所無(wú)法表現(xiàn)現(xiàn)的屬性的補(bǔ)補(bǔ)充性語(yǔ)言。。樣式表的另另外一個(gè)優(yōu)點(diǎn)點(diǎn)就是，在對(duì)對(duì)很多網(wǎng)頁(yè)文文件設(shè)置同一一種屬性時(shí)，，無(wú)須對(duì)所有有文件進(jìn)行反反復(fù)操作，只只要應(yīng)用樣式式表就可以更更加便利、快快捷地進(jìn)行操操作。在Dreamweaver中中只需要單單擊幾次，就就可以在字體體、鏈接、表表格、圖片、、層等構(gòu)成網(wǎng)網(wǎng)頁(yè)文件的所所有元素屬性性中應(yīng)用樣式式表。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.5其其他設(shè)計(jì)計(jì)要素3．表單表單的作用就就是能使訪問(wèn)問(wèn)者與網(wǎng)站或或網(wǎng)站管理人人交互。利用用表單，可根根據(jù)訪問(wèn)者輸輸入的信息，，自動(dòng)生成頁(yè)頁(yè)面反饋給訪訪問(wèn)者；利用用表單，還可可以為網(wǎng)站收收集訪問(wèn)者輸輸入的信息。。表單的使用用其實(shí)可分為為兩部分。一一部分是表單單本身，即怎怎樣把表單作作為頁(yè)面元素素加入到網(wǎng)頁(yè)頁(yè)頁(yè)面。另一一部分為表單單的處理，即即調(diào)用服務(wù)器器端的腳本程程序，或是以以電子郵件的的方式發(fā)送。。在Dreamweaver中利利用“插入面面板”的“表表單”類別中中的圖標(biāo)建立立表單。9.2用用DreamweaverMX2004設(shè)設(shè)計(jì)站點(diǎn)網(wǎng)頁(yè)頁(yè)9.2.5其其他設(shè)計(jì)計(jì)要素4．行為與JavaScriptDreamweaver中行為指指的是能夠簡(jiǎn)簡(jiǎn)單運(yùn)用制作作動(dòng)態(tài)網(wǎng)頁(yè)的的JavaScript功能。網(wǎng)頁(yè)頁(yè)的動(dòng)態(tài)效果果，要往網(wǎng)頁(yè)頁(yè)頁(yè)面里插入入JavaScript小程序。Dremweaver能能自動(dòng)生成一一些JavaScript代碼來(lái)實(shí)實(shí)現(xiàn)動(dòng)態(tài)效果果，使不會(huì)JavaScript的的人也能制作作出動(dòng)態(tài)的網(wǎng)網(wǎng)頁(yè)。利用Dreamweaver的Behavior，，能做出很有有用的頁(yè)面效效果。如果想想運(yùn)用行為，，首先要選擇擇運(yùn)行行為的的對(duì)象，然后后決定要發(fā)生生的動(dòng)作，還還要設(shè)置決定定實(shí)施的動(dòng)作作在何種情況況下發(fā)生的事事件。即行為為由動(dòng)作和事事件組成。在在Dreamweaver的“行為為面板”中，，可以選擇需需要的行為。。另外也可以以在網(wǎng)頁(yè)中插插入自己的JavaScript代代碼。9.3測(cè)測(cè)試和上傳9.3.1測(cè)測(cè)試可以通過(guò)運(yùn)行行“站點(diǎn)報(bào)告告”測(cè)試整個(gè)個(gè)站點(diǎn)并解決決出現(xiàn)的問(wèn)題題。確保頁(yè)面在目目標(biāo)瀏覽器中中能夠如預(yù)期期的那樣工作作，并確保這這些頁(yè)面在其其他瀏覽器中中要么工作正正常，要么““明確地拒絕絕工作”。頁(yè)頁(yè)面在不支持持樣式、層、、插件或JavaScript的的瀏覽器中應(yīng)應(yīng)清晰可讀且且功能正常。。對(duì)于在較早早版本的瀏覽覽器中根本無(wú)無(wú)法運(yùn)行的頁(yè)頁(yè)面，應(yīng)考慮慮使用“檢查查瀏覽器”行行為，自動(dòng)將將訪問(wèn)者重定定向到其他的的頁(yè)面。應(yīng)盡可能多地地在不同的瀏瀏覽器和平臺(tái)臺(tái)上預(yù)覽頁(yè)面面。以便查看看布局、顏色色、字體大小小和默認(rèn)瀏覽覽器窗口大小小等方面的區(qū)區(qū)別，這些區(qū)區(qū)別在目標(biāo)瀏瀏覽器檢查中中是無(wú)法預(yù)見(jiàn)見(jiàn)的。9.3測(cè)測(cè)試和上傳9.3.1測(cè)測(cè)試檢查站點(diǎn)是否否有斷開(kāi)的鏈鏈接，并修復(fù)復(fù)斷開(kāi)的鏈接接。由于其他他站點(diǎn)也在重重新設(shè)計(jì)、重重新組織，您您所鏈接的頁(yè)頁(yè)面可能已被被移動(dòng)或刪除除?？蛇\(yùn)行鏈鏈接檢查報(bào)告告對(duì)鏈接進(jìn)行行測(cè)試。監(jiān)測(cè)頁(yè)面的文文