dreamweaver846;0入門圖文教程

1、dreammweavver8.0入門圖圖文教程：Dreaamweaaver8操作作環(huán)境 第一天的內(nèi)內(nèi)容可能讓讓你覺得枯枯燥乏味，不不過，“工工欲善其事事，必先利利其器”，讓讓我們一起起來了解DDreammweavver8的的操作環(huán)境境，完成站站點的創(chuàng)建建。一一、Dreeamweeaverr8 的操操作環(huán)境在首次次啟動Drreamwweaveer8時會會出現(xiàn)一個個“工作區(qū)區(qū)設(shè)置”對對話框，在在對話框左左側(cè)是Drreamwweaveer8的設(shè)設(shè)計視圖，右右側(cè)是Drreamwweavee 8的代代碼視圖。Dreaamweaaver88設(shè)計視圖圖布局提供供了一個將將全部元素素置于一個個窗口中的的集成布

2、局局。我們選選擇面向設(shè)設(shè)計者的設(shè)設(shè)計視圖布布局。在Dreeamweeave 8 中首首先將顯示示一個起始始頁，可以以勾選這個個窗口下面面的“不在在顯示此對對話框”來來隱藏它。在這個頁頁面中包括括“打開最最近項目”、“創(chuàng)建建新項目”“從范例例創(chuàng)建”33個方便實實用的項目目，建議大大家保留。新建建或打開一一個文檔，進(jìn)進(jìn)入Dreeamweeaverr8的標(biāo)準(zhǔn)準(zhǔn)工作界面面。Dreeamweeaverr8的標(biāo)準(zhǔn)準(zhǔn)工作界面面包括：標(biāo)標(biāo)題顯示、菜單欄、插入面板板組、文檔檔工具欄、標(biāo)準(zhǔn)工具具欄、文檔檔窗口、狀狀態(tài)欄、屬屬性面板和和浮動面板板組。1、標(biāo)標(biāo)題顯示欄欄 啟動Maacrommediaa Dreeamw

3、eeave 8后，標(biāo)標(biāo)題欄將顯顯示文字MMacroomediia Drreamwweavee 8.00，新建或或打開一個個文檔后，在在后面還會會顯示該文文檔所在的的位置和文文件名稱。2、菜單欄欄Dreeamweeave 8的菜單單共有100個，即文文件、編輯輯、視圖、插入、修修改、文本本、命令、站點、窗窗口和幫助助。其中，編編輯菜單里里提供了對對Dreaamweaaver菜菜單中首首選參數(shù)的訪問。文件：用來管理理文件。例例如新建，打打開，保存存，另存為為，導(dǎo)入，輸輸出打印等等。編編輯：用來來編輯文本本。例如剪剪切，復(fù)制制，粘貼，查查找，替換換和參數(shù)設(shè)設(shè)置等。查看：用來切換換視圖模式式以及顯示示

4、、隱藏標(biāo)標(biāo)尺、網(wǎng)格格線等輔助助視圖功能能。插插入：用來來插入各種種元素，例例如圖片、多媒體組組件，表格格、框架及及超級鏈接接等。修改：具具有對頁面面元素修改改的功能，例例如在表格格中插入表表格，拆分分、合并單單元格，對對其對象等等。文文本：用來來對文本操操作，例如如設(shè)置文本本格式等。命令令：所有的的附加命令令項站站點：用來來創(chuàng)建和管管理站點窗口：用來顯示示和隱藏控控制面板以以及切換文文檔窗口幫助：聯(lián)機幫助助功能。例例如按下FF1鍵，就就會打開電電子幫助文文本33、插入面面板組 插入面面板集成了了所有可以以在網(wǎng)頁應(yīng)應(yīng)用的對象象包括“插插入”菜單單中的選項項。插入面面板組其實實就是圖像像化了的插插

5、入指令，通通過一個個個的按鈕，可可以很容易易的加入圖圖像、聲音音、多媒體體動畫、表表格。圖層層、框架、表單、FFlashh和ActtiveXX等網(wǎng)頁元元素。4、文文檔工具欄欄“文文檔”工具具欄包含各各種按鈕，它它們提供各各種“文檔檔”窗口視視圖（如“設(shè)計”視視圖和“代代碼”視圖圖）的選項項、各種查查看選項和和一些常用用操作（如如在瀏覽器器中預(yù)覽）。5、標(biāo)標(biāo)準(zhǔn)工具欄欄“標(biāo)標(biāo)準(zhǔn)”工具具欄包含來來自“文件件”和“編編輯”菜單單中的一般般操作的按按鈕：“新新建”、“打開”、“保存”、“保存存全部”、“剪切”、“復(fù)制制”、“粘粘貼”、“撤消”和和“重做”。6、文文檔窗口當(dāng)我們們打開或創(chuàng)創(chuàng)建一個項項目，進(jìn)

6、入入文檔窗口口，我們可可以在文檔檔區(qū)域中進(jìn)進(jìn)行輸入文文字、插入入表格和編編輯圖片等等操作。“文檔檔”窗口顯顯示當(dāng)前文文檔?？梢砸赃x擇下列列任一視圖圖：“設(shè)計計”視圖是是一個用于于可視化頁頁面布局、可視化編編輯和快速速應(yīng)用程序序開發(fā)的設(shè)設(shè)計環(huán)境。在該視圖圖中，Drreamwweaveer 顯示示文檔的完完全可編輯輯的可視化化表示形式式，類似于于在瀏覽器器中查看頁頁面時看到到的內(nèi)容?！按a”視圖是一一個用于編編寫和編輯輯 HTMML、JaavaSccriptt、服務(wù)器器語言代碼碼以及任何何其他類型型代碼的手手工編碼環(huán)環(huán)境。“代代碼和設(shè)計計”視圖使使您可以在在單個窗口口中同時看看到同一文文檔的“代代

7、碼”視圖圖和“設(shè)計計”視圖。7、狀態(tài)欄“文檔檔”窗口底底部的狀態(tài)態(tài)欄提供與與你正創(chuàng)建建的文檔有有關(guān)的其它它信息。標(biāo)標(biāo)簽選擇器器顯示環(huán)繞繞當(dāng)前選定定內(nèi)容的標(biāo)標(biāo)簽的層次次結(jié)構(gòu)。單單擊該層次次結(jié)構(gòu)中的的任何標(biāo)簽簽以選擇該該標(biāo)簽及其其全部內(nèi)容容。單擊 可可以選擇文文檔的整個個正文。8、屬屬性面板屬性面面板并不是是將所有的的屬性加載載在面板上上，而是根根據(jù)我們選選擇的對象象來動態(tài)顯顯示對象的的屬性屬性性面板的狀狀態(tài)完全是是隨當(dāng)前在在文檔中選選擇的對象象來確定的的。例如，當(dāng)當(dāng)前選擇了了一幅圖像像，那么屬屬性面板上上就出現(xiàn)該該圖像的相相關(guān)屬性；如果選擇擇了表格，那那么屬性面面板會相應(yīng)應(yīng)的變化成成表格的相相關(guān)

8、屬性。9、浮動面面板其其它面板可可以同稱為為浮動面板板，這些面面板都浮動動于編輯窗窗口之外。在初次使使用Dreeamweeave 8的時候候，這些面面板根據(jù)功功能被分成成了若干組組。在窗口口菜單中，選選擇不同的的命令可以以打開基本本面板組、設(shè)計面板板組、代碼碼面板組、應(yīng)用程序序面板組、資源面板板組和其它它面板組。終于于把Dreeamweeave 8的基本本工作界面面介紹完了了，你是否否已經(jīng)了解解它？從現(xiàn)現(xiàn)在開始，讓讓我們一起起來建造一一座小房子子。 dreammweavver8.0入門圖圖文教程：Dreaamweaaver8本地地站點的搭搭建與管理理 要制作一個個能夠被大大家瀏覽的的網(wǎng)站，首首

9、先需要在在本地磁盤盤上制作這這個網(wǎng)站，然然后把這個個網(wǎng)站傳到到互聯(lián)網(wǎng)的的web服服務(wù)器上。放置在本本地磁盤上上的網(wǎng)站被被稱為本地地站點，位位于互聯(lián)網(wǎng)網(wǎng)web服服務(wù)器里的的網(wǎng)站被稱稱為遠(yuǎn)程站站點。Drreamwweaveer 8提提供了對本本地站點和和遠(yuǎn)程站點點強大的管管理功能。 11、規(guī)劃站站點結(jié)構(gòu) 網(wǎng)站站是多個網(wǎng)網(wǎng)頁的集合合，其包括括一個首頁頁和若干個個分頁，這這種集合不不是簡單的的集合。為為了達(dá)到最最佳效果，在在創(chuàng)建任何何 Webb 站點頁頁面之前，要要對站點的的結(jié)構(gòu)進(jìn)行行設(shè)計和規(guī)規(guī)劃。決定定要創(chuàng)建多多少頁，每每頁上顯示示什么內(nèi)容容，頁面布布局的外觀觀以及各頁頁是如何互互相連接起起來的。我

10、們可可以通過把把文件分門門別類的放放置在各自自的文件夾夾里，使網(wǎng)網(wǎng)站的結(jié)構(gòu)構(gòu)清晰明了了，便于管管理和查找找。22、創(chuàng)建站站點在在Dreaamweaave 88中可以有有效的建立立并管理多多個站點。搭建站點點可以有兩兩種方法，一一是利用向向?qū)瓿?，二二是利用高高級設(shè)定來來完成。在搭建建站點前，我我們先在自自己的電腦腦硬盤上建建一個以英英文或數(shù)字字命名的空空文件夾。 （11）選擇菜菜單欄站點管理站點點，出現(xiàn)“管 理站站點”對話話框。點擊擊“新建”按鈕，選選擇彈出菜菜單中的“站點”項項。 在打開開的窗口上上方有“基基本”和“高級”兩兩個標(biāo)簽，可可以在站點點向?qū)Ш透吒呒壴O(shè)置之之間切換。下面選擇擇“基本

11、”標(biāo)簽。在文本本框中，輸輸入一個站站點名字以以在 Drreamwweaveer8.00中標(biāo)識該該站點。這這個名字可可以是任何何你需要的的名字。單單擊“下一一步”。出出現(xiàn)向?qū)У牡南乱粋€界界面，詢問問是否要使使用服務(wù)器器技術(shù)。我們現(xiàn)現(xiàn)在建立的的是一個靜靜態(tài)頁面，所所以選擇“否”。點下一一步，在文文檔框設(shè)置置本地站點點文件夾的的地址。點下一一步，進(jìn)入入站點定義義，我們將將在站點建建設(shè)完成后后在與FTTP鏈接，這這里選擇“無”。單擊“完成”按按鈕，結(jié)束束“站點定定義“對話話框的設(shè)置置。單擊“完成”按按鈕，文件件面板顯示示出剛才建建立的站點點。到此，我我們完成了了站點的創(chuàng)創(chuàng)建。3、搭建建站點結(jié)構(gòu)構(gòu)站點點

12、是文件與與文件夾的的集合，下下面我們根根據(jù)前面對對xmweeb網(wǎng)站的的設(shè)計，來來新建xmmweb站站點要設(shè)置置的文件夾夾和文件。新建建文件夾，在在文件面板板的站點跟跟目錄下單單擊鼠標(biāo)右右鍵，從彈彈出菜單中中選擇“新新建文件夾夾”項，然然后給文件件夾命名。這里我們們創(chuàng)建新建建8個文件件夾，分別別命名為：img、med、swf、txt、css、js、mmoan和和fy。創(chuàng)建頁頁面，在文文件面板的的站點跟目目錄下單擊擊鼠標(biāo)右鍵鍵，從彈出出菜單中選選擇“新建建文件”項項，然后給給文件命名名。首先要要添加首頁頁，我們把把首頁命名名為inddex.hhtml，再再分別新建建01.hhtml、02.hhtm

13、l、03.hhtml、04.hhtml和和05.hhtml。4、文文件與文件件夾的管理理對建建立的文件件和文件夾夾，可以進(jìn)進(jìn)行移動、復(fù)制、重重命名和刪刪除等基本本的管理操操作。單擊擊鼠標(biāo)左鍵鍵選中需要要管理的文文件或文件件夾，然后后單擊鼠標(biāo)標(biāo)右鍵，再再彈出菜單單中選“編編輯”項，即即可進(jìn)行相相關(guān)操作。 dreammweavver8.0入門圖圖文教程：Dreaamweaaver8頁面面的總體設(shè)設(shè)置 HYPERLINK javascript:d=document;t=d.selection?(d.selection.type!=None?d.selection.createRange().text

14、:):(d.getSelection?d.getSelection():);void(vivi=window.open(/collect/icollect.php?pid=&title=+escape(d.title)+&url=+escape(d.location.href)+&desc=+escape(t),vivi,scrollbars=no,width=480,height=480,left=75,top=20,status=no,resizable=yes);vivi.focus(); o 收藏的網(wǎng)頁將被永久地保存到新浪ViVi收藏夾url=/url 新浪ViiVi HYPERLIN

15、K l nw=1,_blank,scrollbars=no,width=600,height=450,left=75,top=20,status=no,resizable=yes); void 0 百度搜藏藏 HYPERLINK javascript:window.open(/post?title=+encodeURIComponent(document.title)+&uri=+encodeURIComponent(document.location.href)+&jumpback=2&noui=1,favit,width=960,height=600,left=50,top=50,tool

16、bar=no,menubar=no,location=no,scrollbars=yes,status=yes,resizable=yes);void(0) QQQ書簽作者:未未知 | 點擊數(shù): 6611 | 時時間:20008-112-4【 HYPERLINK javascript:FontZoom(16) 大 HYPERLINK javascript:FontZoom(14) 中 HYPERLINK javascript:FontZoom(12) 小】我們已經(jīng)描描繪了小屋屋的藍(lán)圖，從從現(xiàn)在開始始，為我們們的小屋添添磚加瓦吧吧。打開001.httml，制制作一個圖圖文混排的的簡單頁面面。一一

17、、頁面的的總體設(shè)置置 11、設(shè)置頁頁面的頭內(nèi)內(nèi)容 頭內(nèi)容容再瀏覽器器中是不可可見的，但但是卻攜帶帶著網(wǎng)頁的的重要信息息，如關(guān)鍵鍵字、描述述文字等，還還可以實現(xiàn)現(xiàn)一些非常常重要的功功能，如自自動刷新功功能。 鼠標(biāo)左左鍵單擊插插入工具欄欄最左邊按按鈕旁的下下拉小三角角，在彈出出菜單中選選擇“HTTML”項項，出現(xiàn)“文件頭”按鈕，點點開下拉菜菜單，就可可以進(jìn)行頭頭內(nèi)容的設(shè)設(shè)置了。 設(shè)置標(biāo)標(biāo)題，網(wǎng)頁頁標(biāo)題可以以是中文、英文或符符號，顯示示在瀏覽器器的標(biāo)題欄欄中。我們們直接在設(shè)設(shè)計窗口上上方的標(biāo)題題欄內(nèi)輸入入或更改，就就可以完成成網(wǎng)頁標(biāo)題題的編輯了了。插插入關(guān)鍵字字，關(guān)鍵字字用來協(xié)助助網(wǎng)絡(luò)上的的搜索引擎

18、擎尋找網(wǎng)頁頁。要想讓讓更多的人人看見你的的網(wǎng)站，這這項要好好好填哦_單擊上上圖所示的的“關(guān)鍵字字”項，彈彈出“關(guān)鍵鍵字”對話話框，填入入關(guān)鍵字即即可。插入MMETA，MMETA標(biāo)標(biāo)記用于記記錄當(dāng)前網(wǎng)網(wǎng)頁的相關(guān)關(guān)信息，如如編碼，作作者，版權(quán)權(quán)等，也可可以用來給給服務(wù)器提提供信息。單擊上圖圖所示的“METAA”項，彈彈出“MEETA”對對話框，在在“屬性”欄選擇“名稱”屬屬性，在“值”文本本框中輸入入相應(yīng)的值值，可以定定義相應(yīng)的的信息。autthor作者信息息，coppyrigght版版權(quán)聲明，ggenerratorr網(wǎng)頁編編輯器。2、設(shè)設(shè)置頁面屬屬性單單擊“屬性性欄”中的的“頁面屬屬性”按鈕鈕，

19、打開的的“頁面屬屬性”對話話框。設(shè)置外外觀，“外外觀”是設(shè)設(shè)置頁面的的一些基本本屬性。我我們可以定定義頁面中中的默認(rèn)文文本字體、文本字號號、文本顏顏色、背景景顏色和背背景圖像等等。我們設(shè)設(shè)置頁面的的所有邊距距為0。設(shè)置鏈鏈接，“鏈鏈接”選項項內(nèi)是一些些與頁面的的鏈接效果果有關(guān)的設(shè)設(shè)置?！版滄溄宇伾倍x超鏈鏈接文本默默認(rèn)狀態(tài)下下的字體顏顏色，“變變換圖像鏈鏈接”定義義鼠標(biāo)放在在鏈接上時時文本的顏顏色，“已已訪問鏈接接”定義訪訪問過的鏈鏈接的顏色色，“活動動鏈接”定定義活動鏈鏈接的顏色色。“下劃劃線樣式”可以定義義鏈接的下下劃線樣式式。設(shè)置標(biāo)標(biāo)題，“標(biāo)標(biāo)題”用來來設(shè)置標(biāo)題題字體的一一些屬性。如下

20、圖所所示，在左左側(cè)“分類類”列表中中選擇“標(biāo)標(biāo)題”，這這里的標(biāo)題題指的并不不是頁面的的標(biāo)題內(nèi)容容，而是可可以應(yīng)用在在具體文章章中各級不不同標(biāo)題上上的一種標(biāo)標(biāo)題字體樣樣式。我們們可以定義義“標(biāo)題字字體”及66種預(yù)定義義的標(biāo)題字字體樣式，包包括粗體、斜體、大大小和顏色色。按自己己的喜歡的的風(fēng)格設(shè)置置吧。dreammweavver8.0入門圖圖文教程：Dreaamweaaver8文本本的插入與與編輯 HYPERLINK javascript:d=document;t=d.selection?(d.selection.type!=None?d.selection.createRange().text:

21、):(d.getSelection?d.getSelection():);void(vivi=window.open(/collect/icollect.php?pid=&title=+escape(d.title)+&url=+escape(d.location.href)+&desc=+escape(t),vivi,scrollbars=no,width=480,height=480,left=75,top=20,status=no,resizable=yes);vivi.focus(); o 收藏的網(wǎng)頁將被永久地保存到新浪ViVi收藏夾url=/url 新浪ViiVi HYPERLINK

22、 l nw=1,_blank,scrollbars=no,width=600,height=450,left=75,top=20,status=no,resizable=yes); void 0 百度搜搜藏 HYPERLINK javascript:window.open(/post?title=+encodeURIComponent(document.title)+&uri=+encodeURIComponent(document.location.href)+&jumpback=2&noui=1,favit,width=960,height=600,left=50,top=50,toolb

23、ar=no,menubar=no,location=no,scrollbars=yes,status=yes,resizable=yes);void(0) QQ書簽簽作者:未未知 | 點擊數(shù): 5500 | 時時間:20008-112-4【 HYPERLINK javascript:FontZoom(16) 大 HYPERLINK javascript:FontZoom(14) 中 HYPERLINK javascript:FontZoom(12) 小】1、插入入文本 要向 Dreaamweaaver 文檔添加加文本，可可以直接在在Dreaamweaaver“文檔”窗窗口中鍵入入文本，也也可以

24、剪切切并粘貼，還還可以從wword文文檔導(dǎo)入文文本。 用鼠標(biāo)標(biāo)在文檔編編輯窗口的的空白區(qū)域域點一下，窗窗口中出現(xiàn)現(xiàn)閃動的光光標(biāo)，提示示文字的起起始位置，將將01.rrar中的的文字 HYPERLINK /Search.asp?Field=Title&keyword=素材 素材材復(fù)制/粘粘貼進(jìn)來。 22、編輯文文本格式 網(wǎng)頁頁的文本分分為段落和和標(biāo)題兩種種格式。 在文文檔編輯窗窗口中選中中一段文本本，在屬性性面板“格格式”后的的下拉列表表框中選擇擇“段落”把選中的的文本設(shè)置置成段落格格式。 “標(biāo)題題1”到“標(biāo)題6”分別表示示各級標(biāo)題題，應(yīng)用于于網(wǎng)頁的標(biāo)標(biāo)題部分。對應(yīng)的字字體由大到到小，同時時文字

25、全部部加粗。 另外外，在屬性性面板中可可以定義文文字的字號號、顏色、加粗、加加斜、水平平對齊等內(nèi)內(nèi)容。 3、設(shè)設(shè)置字體組組合 Dreaamweaaver88預(yù)設(shè)讀的的可供選擇擇的字體組組合只有66項英文字字體組合，要要想使用中中文字體，必必須重新編編輯新的字字體組合，在在“字體”后的下拉拉列表框中中選擇“編編輯字體列列表”，彈彈出“編輯輯字體列表表”對話框框： 4、文文字的其它它設(shè)置 文本換換行，按EEnterr鍵換行的的行距較大大（在代碼碼區(qū)生成標(biāo)簽簽），按EEnterrShiift鍵換換行的行間間距較?。ㄔ谠诖a區(qū)生生成標(biāo)簽）。 文文本空格，我我們選擇編編輯/首選選參數(shù)，在在彈出得對對話框

26、中左左側(cè)的分類類列表中選選擇“常規(guī)規(guī)”項，然然后在右邊邊選“允許許多個連續(xù)續(xù)的空格”項，我們們就可以直直接按“空空格”鍵給給文本添加加空格了。特殊字字符，要向向網(wǎng)頁中插插入特殊字字符，需要要在快捷工工具欄選擇擇“文本”，切換到到字符插入入欄，單擊擊文本插入入欄的最后后一個按鈕鈕，可以向向網(wǎng)頁中插插入相應(yīng)的的特殊符號號。插入列列表，列表表分為兩種種，有序列列表和無序序列表，無無序列表沒沒有順序，每每一項前邊邊都以同樣樣的符號顯顯示，有序序列表前邊邊的每一項項有序號引引導(dǎo)。在文文檔編輯窗窗口中選中中需要設(shè)置置的文本，在在屬性面板板中單擊，則則選中的文文本被設(shè)置置成無序列列表，單擊擊則被設(shè)置置成有序

27、列列表。插入水平平線，水平平線起到分分隔文本的的排版作用用，選擇快快捷工具欄欄的“HTTML”項項，單擊HHTML欄欄的第一個個按鈕，即即可向網(wǎng)頁頁中插入水水平線。選選中插入的的這條水平平線，可以以在屬性面面板對它的的屬性進(jìn)行行設(shè)置。 插入入時間，在在文檔編輯輯窗口中，將將鼠標(biāo)光標(biāo)標(biāo)移動到要要插入日期期的位置，單單擊常用插插入欄的“日期”按按鈕，在彈彈出的“插插入日期”對話框中中選擇相應(yīng)應(yīng)的格式即即可。 dreammweavver8.0入門圖圖文教程：Dreaamweaaver8插入入圖像 HYPERLINK javascript:d=document;t=d.selection?(d.sel

28、ection.type!=None?d.selection.createRange().text:):(d.getSelection?d.getSelection():);void(vivi=window.open(/collect/icollect.php?pid=&title=+escape(d.title)+&url=+escape(d.location.href)+&desc=+escape(t),vivi,scrollbars=no,width=480,height=480,left=75,top=20,status=no,resizable=yes);vivi.focus(); o

29、 收藏的網(wǎng)頁將被永久地保存到新浪ViVi收藏夾url=/url 新浪ViiVi HYPERLINK l nw=1,_blank,scrollbars=no,width=600,height=450,left=75,top=20,status=no,resizable=yes); void 0 百度搜搜藏 HYPERLINK javascript:window.open(/post?title=+encodeURIComponent(document.title)+&uri=+encodeURIComponent(document.location.href)+&jumpback=2&noui=

30、1,favit,width=960,height=600,left=50,top=50,toolbar=no,menubar=no,location=no,scrollbars=yes,status=yes,resizable=yes);void(0) QQ書簽簽作者:未未知 | 點擊數(shù): 5244 | 時時間:20008-112-4【 HYPERLINK javascript:FontZoom(16) 大 HYPERLINK javascript:FontZoom(14) 中 HYPERLINK javascript:FontZoom(12) 小】目前互聯(lián)網(wǎng)網(wǎng)上支持的的圖像格式式主要有GGI

31、F、JJPEG和和PNG。其中使用用最為廣泛泛的是GIIF和JPPEG。1、插插入圖像在制作作網(wǎng)頁時，先先構(gòu)想好網(wǎng)網(wǎng)頁布局，在在圖像處理理軟件中將將需要插入入的圖片進(jìn)進(jìn)行處理，然然后存放在在站點根目目錄下的文文件夾里。插圖圖圖像時，將將光標(biāo)放置置在文檔窗窗口需要插插入圖像的的位置，然然后鼠標(biāo)單單擊常用插插入欄的“圖像”按按鈕。 彈出的的“選擇圖圖像源文件件”對話框框，選擇iimg/0001.jjpg，單單擊“確定定”按鈕就就把圖像0001.jjpg插入入到了網(wǎng)頁頁中。注意：如果我們們在插入圖圖片的時候候，沒有將將圖片保存存在站點根根目錄下，會會彈出下圖圖所示的對對話框，提提醒我們要要把圖片保保

32、存在站點點內(nèi)部，這這時單擊“是”按鈕鈕，然后選選擇本地站站點的路徑徑將圖片保保存，圖像像也可以被被插入到網(wǎng)網(wǎng)頁中。2、設(shè)設(shè)置圖像屬屬性選選中圖像后后，在屬性性面板中顯顯示出了圖圖像的屬性性，如下如如所示。在屬性性面板的左左上角，顯顯示當(dāng)前圖圖像的縮略略圖，同時時顯示圖像像的大小。在縮略圖圖右側(cè)有一一個文本框框，在其中中可以輸入入圖像標(biāo)記記的名稱。 圖圖像的大小小是可以改改變的，但但是在DWW里更改是是極不好的的習(xí)慣，如如果我們的的電腦安裝裝了FW軟軟件，單擊擊屬性面板板的“編輯輯”旁邊的的，即可啟啟動FW對對圖像進(jìn)行行縮放等處處理。當(dāng)圖圖像的大小小改變時，屬屬性欄中“寬”和“高”的數(shù)數(shù)值會以粗

33、粗體顯示，并并在旁邊出出現(xiàn)一個弧弧形箭頭，單單擊它可以以恢復(fù)圖像像的原始大大小。 “水平平邊距”和和“垂直邊邊距”文本本框用來設(shè)設(shè)置圖像左左右和上下下與其它頁頁面元素的的距離。 “邊邊框”文本本框時用來來設(shè)置圖像像邊框的寬寬度，默認(rèn)認(rèn)的邊框?qū)拰挾葹?。 “替代”文文本框用來來設(shè)置圖像像的替代文文本，可以以輸入一段段文字，當(dāng)當(dāng)圖像無法法顯示時，將將顯示這段段文字。 單擊擊屬性面板板中的對齊齊按鈕，可可以分別將將圖像設(shè)置置成瀏覽器器居左對齊齊、居中對對齊、居右右對齊。 在屬屬性面板中中，“對齊齊”下拉列列表框時設(shè)設(shè)置圖像與與文本的相相互對齊方方式，共有有10個選選項。通過過它我們可可以將文字字對齊

34、到圖圖像的上端端、下端、左邊和右右邊等，從從而可以靈靈活的實現(xiàn)現(xiàn)文字與圖圖片的混排排效果。 3、插入其它它圖像元素素 在在我們單擊擊常用插入入欄的“圖圖像”按鈕鈕時，可以以看到，除除了第1項項“圖像”外，還有有“圖像占占位符”、“鼠標(biāo)經(jīng)經(jīng)過圖像”、“導(dǎo)航航條”等項項目。 插入圖圖像占位符符，在我們們布局頁面面時，如果果要在網(wǎng)頁頁中插入一一張圖片，可可以先不制制作圖片，而而是使用占占位符來代代替圖片位位置。單擊擊下拉列表表中的“圖圖像占位符符”，打開開“圖像占占位符”對對話框。按按設(shè)計需要要設(shè)置圖片片的寬度和和高度，輸輸入呆插入入圖像的名名稱，即可可。鼠標(biāo)經(jīng)經(jīng)過圖像，鼠鼠標(biāo)經(jīng)過圖圖像實際上上由兩

35、個圖圖像組成，主主圖像（當(dāng)當(dāng)首次載入入頁時顯示示的圖像）和和次圖像（當(dāng)當(dāng)鼠標(biāo)指針針移過主圖圖像時顯示示的圖像）。這兩張圖圖片要大小小相等，如如果不相等等，DW自自動調(diào)整次次圖片的大大小跟主圖圖像大小一一致。 圖片片與文本一一樣，是網(wǎng)網(wǎng)頁中最常常用到的內(nèi)內(nèi)容，其變變化相對較較少，要想想排出精致致美觀的網(wǎng)網(wǎng)頁，下一一節(jié)課的內(nèi)內(nèi)容可是必必不可少的的哦，繼續(xù)續(xù)努力吧_ dreammweavver8.0入門圖圖文教程：Dreaamweaaver8插入入并編輯表表格 HYPERLINK javascript:d=document;t=d.selection?(d.selection.type!=None?

36、d.selection.createRange().text:):(d.getSelection?d.getSelection():);void(vivi=window.open(/collect/icollect.php?pid=&title=+escape(d.title)+&url=+escape(d.location.href)+&desc=+escape(t),vivi,scrollbars=no,width=480,height=480,left=75,top=20,status=no,resizable=yes);vivi.focus(); o 收藏的網(wǎng)頁將被永久地保存到新浪Vi

37、Vi收藏夾url=/url 新浪ViiVi HYPERLINK l nw=1,_blank,scrollbars=no,width=600,height=450,left=75,top=20,status=no,resizable=yes); void 0 百度搜搜藏 HYPERLINK javascript:window.open(/post?title=+encodeURIComponent(document.title)+&uri=+encodeURIComponent(document.location.href)+&jumpback=2&noui=1,favit,width=960,

38、height=600,left=50,top=50,toolbar=no,menubar=no,location=no,scrollbars=yes,status=yes,resizable=yes);void(0) QQ書簽簽作者:未未知 | 點擊數(shù): 5811 | 時時間:20008-112-4【 HYPERLINK javascript:FontZoom(16) 大 HYPERLINK javascript:FontZoom(14) 中 HYPERLINK javascript:FontZoom(12) 小】表格是網(wǎng)頁頁設(shè)計制作作不可缺少少的元素，它它以簡潔明明了和高效效快捷的方方式將圖

39、片片、文本、數(shù)據(jù)和表表單的元素素有序的顯顯示在頁面面上，讓我我們可以設(shè)設(shè)計出漂亮亮的頁面，使使用表格排排版的頁面面在不同平平臺、不同同分辨率的的瀏覽器里里都能保持持其原有的的布局，而而在不同的的瀏覽器平平臺有較好好的兼容性性，所以表表格是網(wǎng)頁頁中最常用用的排版方方式之一。一、插入入并編輯表表格 1、插入入表格在文檔窗窗口中，將將光標(biāo)放在在需要創(chuàng)建建表格的位位置，單擊擊“常用”快捷欄中中的表格按按鈕彈出的的“表格”對話框，指指定表格的的屬性后，在在文檔窗口口中插入設(shè)設(shè)置的表格格。 “行數(shù)”文文本框用來來設(shè)置表格格的行數(shù)?！傲辛袛?shù)”文本本框用來設(shè)設(shè)置表格的的列數(shù)?！氨砀窀駥挾取蔽奈谋究蛴脕韥碓O(shè)置表

40、格格的寬度，可可以填入數(shù)數(shù)值，緊隨隨其后的下下拉列表框框用來設(shè)置置寬度的單單位，有兩兩個選項百分比比和像素。當(dāng)寬度的的單位選擇擇百分比時時，表格的的寬度會隨隨瀏覽器窗窗口的大小小而改變。 “單元格邊邊距”文本本框用來設(shè)設(shè)置單元格格的內(nèi)部空空白的大小小。 “單元格格間距”文文本框用來來設(shè)置單元元格與單元元格之間的的距離。 “邊邊框粗細(xì)”用來設(shè)置置表格的邊邊框的寬度度。 “頁眉”定定義頁眉樣樣式，可以以在四種樣樣式中選擇擇一種。 “標(biāo)標(biāo)題” 定定義表格的的標(biāo)題。 “對對其標(biāo)題”定義表格格標(biāo)題的對對齊方式。 “摘要” 可以在這這里對表格格進(jìn)行注釋釋。2、選選擇單元格格對象對于表格格、行、列列、單元格

41、格屬性的設(shè)設(shè)置是以選選擇這些對對象為前提提的。選擇整個個表格的方方法是把鼠鼠標(biāo)放在表表格邊框的的任意處，當(dāng)當(dāng)出現(xiàn)這樣樣的標(biāo)志時時單擊即可可選中整個個表格，或或在表格內(nèi)內(nèi)任意處單單擊，然后后在狀態(tài)欄欄選中標(biāo)簽即即可；或在在單元格任任意處單擊擊，點鼠標(biāo)標(biāo)右鍵在彈彈出菜單菜菜單中選擇擇“表格選擇表表格”要選中某某一單元格格，按住CCtrl鍵鍵，鼠標(biāo)在在需要選中中的單元格格單擊即可可；或者，選選中狀態(tài)欄欄中的標(biāo)簽簽。要要選中連續(xù)續(xù)的單元格格，按住鼠鼠標(biāo)左鍵從從一個單元元格的左上上方開始向向要連續(xù)選選擇單元格格的方向拖拖動。要選選中不連續(xù)續(xù)的幾個單單元格，可可以按住CCtrl鍵鍵，單擊要要選擇的所所有單

42、元格格即可。要選擇擇某一行或或某一列，將將光標(biāo)移動動到行左側(cè)側(cè)或列上方方，鼠標(biāo)指指針變?yōu)橄蛳蛴一蛳蛳孪碌募^圖圖標(biāo)時，單單擊即可。3、設(shè)置表格格屬性選中一個個表格后，可可以通過屬屬性面板更更改表格屬屬性?！疤畛涑洹蔽谋究蚩蛴脕碓O(shè)置置單元格邊邊距，“間間距”文本本框用來設(shè)設(shè)置單元格格間距?！皩R”下拉列表表框用來設(shè)設(shè)置表格的的對齊方式式，默認(rèn)的的對齊方式式一般為左左對齊。“邊框框”文本框框用來設(shè)置置表格邊框框的寬度?！氨潮尘邦伾蔽谋究蛴糜脕碓O(shè)置表表格的背景景顏色?！斑吙蚩蝾伾庇糜脕碓O(shè)置表表格邊框的的顏色。 在“背景圖像像”文本框框填入表格格背景圖像像的路徑，可可以給表格格添加背景景圖像。也也

43、可以如下下圖所示給給文本框加加上鏈接路路徑。還可可以單擊文文本框后的的“瀏覽”按鈕，查查找圖像文文件。在“選擇圖像像源”對話話框中定位位并選擇要要設(shè)置為背背景的圖片片，單擊“確認(rèn)”按按鈕即可。4、單單元格屬性性把光光標(biāo)移動到到某個單元元格內(nèi)，可可以利用單單元格屬性性面板對這這個單元格格的屬性進(jìn)進(jìn)行設(shè)置?！八狡健蔽谋究蚩蛴脕碓O(shè)置置單元格內(nèi)內(nèi)元素的水水平排版方方式，是居居左、居右右或是居中中?！按怪薄蔽奈谋究蛴脕韥碓O(shè)置單元元格內(nèi)的垂垂直排版方方式，是頂頂端對齊、底端對齊齊或是居中中對齊?！案摺薄ⅰ皩挕蔽谋究蛴糜脕碓O(shè)置單單元格的寬寬度和高度度?！安粨Q行”復(fù)選框可可以防止單單元格中較較長的文本本自動

44、換行行。“標(biāo)題”復(fù)復(fù)選框使選選擇的單元元格成為標(biāo)標(biāo)題單元格格，單元格格內(nèi)的文字字自動以標(biāo)標(biāo)題格式顯顯示出來?！氨潮尘啊蔽谋颈究蛴脕碓O(shè)設(shè)置表格的的背景圖像像。“背景顏色色”文本框框用來設(shè)置置表格的背背景顏色?！斑吙颉蔽谋究蛴糜脕砩O(shè)置置表格邊框框的顏色。5、表格的行行和列選中要插插入行或列列的單元格格，單擊鼠鼠標(biāo)右鍵，在在彈出菜單單中選擇“插入行”或“插入入列”或“插入行或或列”命令令。如果選選擇了“插插入行”命命令，在選選擇行的上上方就插入入了一個空空白行，如如果選擇了了“插入列列”命令，就就在選擇列列的左側(cè)插插入了一列列空白列。如果果選擇了“插入行或或列”命令令，會彈出出“插入行行或列”對對

45、話框，可可以設(shè)置插插入行還是是列、插入入的數(shù)量，以以及使在當(dāng)當(dāng)前選擇的的單元格的的上方或下下方、左側(cè)側(cè)或是右側(cè)側(cè)插入行或或列。要刪除除行或列，選選擇要刪除除的行或列列，單擊鼠鼠標(biāo)右鍵，在在彈出菜單單中選擇“刪除行”或“刪除除列”命令令即可。6、拆拆分與合并并單元格拆分單單元格時，將將光標(biāo)放在在待拆分的的單元格內(nèi)內(nèi)，單擊屬屬性面板上上的“拆分分”按鈕，在在彈出對話話框中，按按需要設(shè)置置即可。合并單單元格時，選選中要合并并的單元格格，單擊屬屬性面板中中的“合并并”按鈕即即可。dreammweavver8.0入門圖圖文教程:Dreaamweaaver8嵌套套表格 HYPERLINK javascri

46、pt:d=document;t=d.selection?(d.selection.type!=None?d.selection.createRange().text:):(d.getSelection?d.getSelection():);void(vivi=window.open(/collect/icollect.php?pid=&title=+escape(d.title)+&url=+escape(d.location.href)+&desc=+escape(t),vivi,scrollbars=no,width=480,height=480,left=75,top=20,status

47、=no,resizable=yes);vivi.focus(); o 收藏的網(wǎng)頁將被永久地保存到新浪ViVi收藏夾url=/url 新浪ViiVi HYPERLINK l nw=1,_blank,scrollbars=no,width=600,height=450,left=75,top=20,status=no,resizable=yes); void 0 百度搜搜藏 HYPERLINK javascript:window.open(/post?title=+encodeURIComponent(document.title)+&uri=+encodeURIComponent(documen

48、t.location.href)+&jumpback=2&noui=1,favit,width=960,height=600,left=50,top=50,toolbar=no,menubar=no,location=no,scrollbars=yes,status=yes,resizable=yes);void(0) QQ書簽簽作者:未未知 | 點擊數(shù): 4677 | 時時間:20008-112-4【 HYPERLINK javascript:FontZoom(16) 大 HYPERLINK javascript:FontZoom(14) 中 HYPERLINK javascript:Fon

49、tZoom(12) 小】表格之中還還有表格即即嵌套表格格。網(wǎng)網(wǎng)頁的排版版有時會很很復(fù)雜，在在外部需要要一個表格格來控制總總體布局，如如果內(nèi)部排排版的細(xì)節(jié)節(jié)也通過總總表格來實實現(xiàn)，容易易引起行高高列寬等的的沖突，給給表格的制制作帶來困困難。其次次，瀏覽器器在解析網(wǎng)網(wǎng)頁的時候候，是將整整個網(wǎng)頁的的結(jié)構(gòu)下載載完畢之后后才顯示表表格，如果果不使用嵌嵌套，表格格非常復(fù)雜雜，瀏覽者者要等待很很長時間才才能看到網(wǎng)網(wǎng)頁內(nèi)容。引入入嵌套表格格，由總表表格負(fù)責(zé)整整體排版，由由嵌套的表表格負(fù)責(zé)各各個子欄目目的排版，并并插入到總總表格的相相應(yīng)位置中中，各司其其職，互不不沖突。另外，通通過嵌套表表格，利用用表格的背背景

50、圖像、邊框、單單元格間距距和單元格格邊距等屬屬性可以得得到漂亮的的邊框效果果，制作出出精美的音音畫貼圖網(wǎng)網(wǎng)頁。創(chuàng)建嵌套套表格的操操作方法，先先插入總表表格，然后后將光標(biāo)置置于要插入入嵌套表格格的地方，繼繼續(xù)插入表表格即可。1、將光標(biāo)放放置在文檔檔窗口要插插入表格的的位置，單單擊常用插插入欄“表表格”按鈕鈕，插入一一個1行11列的表格格一，寬度度500像像素，高度度100，邊框為為0，單元元格間距為為0，單元元格邊距為為12像素素。背景圖圖像選擇bbeij/003.gif。2、將光標(biāo)放放置在表格格一內(nèi)，插插入表格二二，1行11列，寬度度100，高度1100，邊邊框為0，單單元格間距距為0，單單元

51、格邊距距為12像像素。背景景圖像選擇擇beijj/0022.giff。33、將光標(biāo)標(biāo)放置在表表格二內(nèi)，插插入表格二二，1行11列，寬度度100，高度1100，單單元格間距距和單元格格邊距都為為8像素，邊邊框為100，邊框顏顏色為#FFEE4EED。背景景圖像選擇擇beijj/0055.giff。44、將光標(biāo)標(biāo)放置在表表格三內(nèi)，選選擇單元格格的背景圖圖像為beeij/0006.ggif。添添加文字“恭賀新禧禧”，字號號68pxx，字體為為隸書，顏顏色為#AA510008。 三、表表格的格式式化做做好的表格格可以使用用DW提供供的預(yù)設(shè)外外觀，可以以提高制作作效率，保保持表格外外觀的同一一性，同時時

52、樣式提供供的色彩搭搭配也比較較美觀。插入一一個5行66列的表格格，表格的的寬為5000像素，高高為3000像素，邊邊框、單元元格間距和和邊距全為為0 。選擇表表格，居中中對齊表格格后，執(zhí)行行命令/格格式化表格格，彈出“格式化表表格”對話話框，我們們選擇AlltRowws reed格式，單單擊“確定定”表格的的樣式就設(shè)設(shè)定好了。m 這里，還還可以自己己設(shè)定相應(yīng)應(yīng)的參數(shù)值值。dreammweavver8.0入門圖圖文教程:插入Fllash動動畫 HYPERLINK javascript:d=document;t=d.selection?(d.selection.type!=None?d.selec

53、tion.createRange().text:):(d.getSelection?d.getSelection():);void(vivi=window.open(/collect/icollect.php?pid=&title=+escape(d.title)+&url=+escape(d.location.href)+&desc=+escape(t),vivi,scrollbars=no,width=480,height=480,left=75,top=20,status=no,resizable=yes);vivi.focus(); o 收藏的網(wǎng)頁將被永久地保存到新浪ViVi收藏夾ur

54、l=/url 新浪ViiVi HYPERLINK l nw=1,_blank,scrollbars=no,width=600,height=450,left=75,top=20,status=no,resizable=yes); void 0 百度搜搜藏 HYPERLINK javascript:window.open(/post?title=+encodeURIComponent(document.title)+&uri=+encodeURIComponent(document.location.href)+&jumpback=2&noui=1,favit,width=960,height=

55、600,left=50,top=50,toolbar=no,menubar=no,location=no,scrollbars=yes,status=yes,resizable=yes);void(0) QQ書簽簽作者:未未知 | 點擊數(shù): 5000 | 時時間:20008-112-4【 HYPERLINK javascript:FontZoom(16) 大 HYPERLINK javascript:FontZoom(14) 中 HYPERLINK javascript:FontZoom(12) 小】通過前面三三課的學(xué)習(xí)習(xí)，相信你你已經(jīng)能制制作出一個個簡單的網(wǎng)網(wǎng)頁了，很很有成就感感吧_不過過，

56、一個優(yōu)優(yōu)秀的網(wǎng)站站應(yīng)該不僅僅僅是由文文字和圖片片組成的，而而是動態(tài)的的、多媒體體。為了增增強網(wǎng)頁的的表現(xiàn)力，豐豐富文檔的的顯示效果果，我們可可以向其FFlashh動畫、JJava小小程序、音音頻播放插插件等多媒媒體內(nèi)容。一、插入Fllash動動畫11、插入FFlashh為了了合理的安安排這一課課的頁面元元素，在插插入Flaash動畫畫之前，讓讓我們先來來復(fù)習(xí)一下下表格布局局吧_打開開03.hhtml，設(shè)設(shè)置頁面屬屬性，在彈彈出的“頁頁面屬性”對話框中中，“外觀觀”項設(shè)置置字體為“宋體”，字字號為166px，文文本顏色為為#F2882A8，背背景圖像為為img/008.JPG，上上邊距為550p

57、x、下、左、右的邊距距都為0。 “鏈接接”項選擇擇始終無下下劃線，鏈鏈接顏色為為#F2882A8，已已訪問鏈接接為#F55E4588。 現(xiàn)在我們們開始布局局_（11）插入一一個1行11列的表格格（表格11），表格格的寬度為為726ppx，邊框框粗細(xì)為00，單元格格邊距為00、單元格格間距為11，背景顏顏色為#88923221，將表表格居中對對齊。（2） 插入一個個3行2列列的表格（表表格2），表表格的寬度度為1000，邊框框粗細(xì)為00，單元格格邊距和單單元格間距距都為0，背背景顏色#6DCFFF6。設(shè)設(shè)置第一行行左邊單元元格的寬為為173ppx，高為為137ppx，設(shè)置置第二行的的高為2338

58、px，將將第三行的的兩個單元元格合并，高高度為500px。在在第一行左左側(cè)單元格格插入圖片片img/102.gif,在右側(cè)單單元格插入入圖片immg/1001.jppg。在第第三行將光光標(biāo)水平居居中，輸入入文字“版版權(quán)所有閃客啟航航”（33）在表格格2第二行行左側(cè)單元元格插入一一個6行一一列的表格格（表格33），表格格寬度為995，邊邊框和單元元格邊距為為0，單元元格間距為為5，將表表格居中對對齊。第一一行高度為為15，其其余各行高高度都為440。 (4) 在表格格2右側(cè)單單元格插入入一個1行行2列的表表格（表格格4），表表格寬度為為550ppx。邊框框、單元格格邊距和間間距都為00。好好啦我

59、們們完成了頁頁面的布局局，開始插插入頁面元元素。將光標(biāo)放放置在表格格4右側(cè)單單元格中，單單擊常用快快捷欄中的的媒體按鈕鈕，然后在在彈出的列列表中選擇擇Flassh。彈出“選擇文件件”對話框框，選擇sswf文件件夾中的hhuaduuo.swwf文件。單擊“確確定”按鈕鈕后，插入入的Flaash動畫畫并不會在在文檔窗口口中顯示內(nèi)內(nèi)容，而是是以一個帶帶有字母FF的灰色框框來表示。在文文檔窗口單單擊這個FFlashh文件，就就可以在屬屬性面板中中設(shè)置它的的屬性了。勾選“循環(huán)”復(fù)復(fù)選框時影影片將連續(xù)續(xù)播放，否否則影片在在播放一次次后自動停停止。通過勾選選“自動播播放”復(fù)選選框后，可可以設(shè)定FFlashh

60、文件是否否在頁面加加載時就播播放。在“品質(zhì)質(zhì)”下拉列列表中可以以選擇Fllash影影片的畫質(zhì)質(zhì)，以最佳佳狀態(tài)顯示示，就選擇擇“高品質(zhì)質(zhì)”?！皩R”下拉列表表用來設(shè)置置Flassh動畫的的對齊方式式，為為了使頁面面的背景在在Flassh下能夠夠襯托出來來，我們可可以使Fllash的的背景變?yōu)闉橥该?。單單擊屬性面面板中的“參?shù)”按按鈕，打開開“參數(shù)”對話框，設(shè)設(shè)置參數(shù)為為wmodde，值為為trannsparrent。這樣在在任何背景景下，F(xiàn)llash動動畫都能實實現(xiàn)透明背背景的顯示示。22、插入FFlashh文本 我們將將光標(biāo)放置置在表格33第二行的的單元格中中，用Fllash文文本制作導(dǎo)導(dǎo)航欄