Dreamweaver 界面及站點(diǎn)建設(shè)

21世紀(jì)高等院校規(guī)劃教材Dreamweaver8基礎(chǔ)與實(shí)例教程馬憲敏主編中國(guó)水利水電出版社1第1章Dreamweaver8.0界面及站點(diǎn)建設(shè)第1章Dreamweaver8.0界面及站點(diǎn)建設(shè)1.1Dreamweaver8.0簡(jiǎn)介1.2創(chuàng)建站點(diǎn)1.3網(wǎng)頁(yè)文件的基本操作1.4設(shè)置頁(yè)面屬性1.5練習(xí)制作簡(jiǎn)單的網(wǎng)頁(yè)站點(diǎn)31.1Dreamweaver8.0簡(jiǎn)介1.1.1Dreamweaver8.0的啟動(dòng)和退出1.1.2Dreamweaver8.0的工作環(huán)境41.1.1Dreamweaver8.0的啟動(dòng)和退出1.啟動(dòng)Dreamweaver8.0在Windows操作系統(tǒng)下，單擊左下角的【開始】按鈕，從【程序】菜單中選擇Macromedia菜單，然后從子菜單中單擊【MacromediaDreamweaver8】即可啟動(dòng)，如圖所示。52.退出Dreamweaver8.0退出Dreamweaver8.0的方法很簡(jiǎn)單，我們可以有以下幾種方式退出編輯界面：（1）單擊Dreamweaver8窗口右上方的關(guān)閉按鈕；（2）按下“Alt+F4”組合鍵；（3）選擇“文件”菜單中的“退出”命令，或按快捷鍵Ctrl+Q退出系統(tǒng)。61.1.2Dreamweaver8.0的工作環(huán)境Dreamweaver8.0的操作窗口71.2創(chuàng)建站點(diǎn)1.2.1創(chuàng)建本地站點(diǎn)1.2.2管理站點(diǎn)1.2.3管理網(wǎng)站中的文件和文件夾81.2.1創(chuàng)建本地站點(diǎn)步驟1：在本地硬盤上建立一個(gè)用來存放站點(diǎn)的文件夾，命名為“site”，該文件夾就是本地站點(diǎn)的根目錄，是為網(wǎng)站特別建立的一個(gè)文件夾。步驟2:打開Dreamweaver8.0，選擇“站點(diǎn)”菜單下的“管理站點(diǎn)”命令，或者選擇文件面板中的“管理站點(diǎn)”命令，打開“管理站點(diǎn)”對(duì)話框。

9步驟3:單擊“管理站點(diǎn)”對(duì)話框中的“新建”按鈕，在彈出菜單中選擇“站點(diǎn)”命令。10步驟4：?jiǎn)螁螕簟啊罢军c(diǎn)點(diǎn)”命命令后后，系系統(tǒng)會(huì)會(huì)彈出出窗口口，這這是一一個(gè)定定義站站點(diǎn)的的向?qū)?dǎo)，選選擇““基本本”選選項(xiàng)卡卡，給給網(wǎng)站站定義義一個(gè)個(gè)名稱稱，例例如““數(shù)學(xué)學(xué)與計(jì)計(jì)算機(jī)機(jī)系””。11步驟5：：?jiǎn)螕簟啊跋乱徊讲健卑粹o鈕，在窗窗口中設(shè)設(shè)置網(wǎng)站站是否使使用服務(wù)務(wù)器技術(shù)術(shù)，例如如：ASP、PHP等等。由于于我們要要制作的的是基本本的靜態(tài)態(tài)網(wǎng)站，，所以選選擇“否否，我不不想使用用服務(wù)器器技術(shù)””單選按按鈕。12步驟6：：?jiǎn)螕簟啊跋乱徊讲健卑粹o鈕，開始始設(shè)置網(wǎng)網(wǎng)頁(yè)的存存儲(chǔ)方法法和存儲(chǔ)儲(chǔ)路徑。。在上半半部分的的單選項(xiàng)項(xiàng)中選擇擇第一項(xiàng)項(xiàng)“編輯輯我的計(jì)計(jì)算機(jī)上上的本地地副本，，完成后后再上傳傳到服務(wù)務(wù)器（推推薦）””。如果果申請(qǐng)的的網(wǎng)站空空間支持持在線編編輯功能能，那么么可以選選擇“使使用本地地網(wǎng)絡(luò)直直接在服服務(wù)器上上編輯””單選項(xiàng)項(xiàng)。13步驟7：：完成以以上的設(shè)設(shè)置后單單擊“下下一步””按鈕，，在這里里選擇連連接服務(wù)務(wù)器的方方式，以以及網(wǎng)頁(yè)頁(yè)在服務(wù)務(wù)器上的的存儲(chǔ)位位置。14步驟8：：?jiǎn)螕簟啊跋乱徊讲健卑粹o鈕。在這這里選擇擇是否使使用“存存回”和和“取出出”。選選中“是是，啟用用存回和和取出””選項(xiàng)，，可以多多人共同同完成網(wǎng)網(wǎng)站的維維護(hù)工作作。如果果只需一一個(gè)就能能夠完成成網(wǎng)站的的維護(hù)工工作，可可以選擇擇“否””。15步驟9：：至此完完成了對(duì)對(duì)網(wǎng)站的的基本定定義。單單擊“下下一步””按鈕，，Dreamweaver8.0會(huì)彈出出對(duì)話框框詢問設(shè)設(shè)置的信信息是否否準(zhǔn)確，，單擊““完成””按鈕，，本地站站點(diǎn)就創(chuàng)創(chuàng)建成功功了。16管管理站點(diǎn)點(diǎn)1.切換換站點(diǎn)Dreamweaver8.0中中可以同同時(shí)存在在多個(gè)站站點(diǎn)，在在文件面面板左邊邊的下拉拉列表框框中選中中某個(gè)已已創(chuàng)建的的站點(diǎn)，，就可切切換到對(duì)對(duì)這個(gè)站站點(diǎn)進(jìn)行行操作的的狀態(tài)。。172．編輯輯站點(diǎn)如果要對(duì)對(duì)站點(diǎn)進(jìn)進(jìn)行編輯輯，可以以在“管管理站點(diǎn)點(diǎn)”對(duì)話話框中，，選擇要要編輯的的站點(diǎn)，，然后用用鼠標(biāo)單單擊“管管理站點(diǎn)點(diǎn)”對(duì)話話框中的的“編輯輯”按鈕鈕，重新新打開““站點(diǎn)定定義”向向?qū)В鶕?jù)需要要一步一一步修改改站點(diǎn)的的屬性即即可。183．刪除除站點(diǎn)如果不需需要某個(gè)個(gè)站點(diǎn)時(shí)時(shí)，可以以將其從從站點(diǎn)列列表中刪刪除。選選擇“站站點(diǎn)”菜菜單下的的“管理理站點(diǎn)””命令，，打開““管理站站點(diǎn)”對(duì)對(duì)話框，，在該對(duì)對(duì)話框中中選擇一一個(gè)站點(diǎn)點(diǎn)，單擊擊“刪除除”按鈕鈕，即可可刪除一一個(gè)站點(diǎn)點(diǎn)，對(duì)某某一個(gè)站站點(diǎn)進(jìn)行行刪除操操作后，，網(wǎng)站的的文件仍仍保存在在硬盤原原來的位位置上，，并沒有有從硬盤盤上刪除除。191.2.3管理理網(wǎng)站中中的文件件和文件件夾1．創(chuàng)建建文件夾夾和文件件文件面板板通常顯顯示站點(diǎn)點(diǎn)中的所所有文件件和文件件夾，但但新建的的站點(diǎn)中中不包含含任何文文件或文文件夾。。所有的的文件和和文件夾夾都需要要新建，，在文件件面板中中站點(diǎn)根根目錄上上單擊鼠鼠標(biāo)右鍵鍵，然后后從彈出出的快捷捷菜單中中單擊菜菜單項(xiàng)““新建文文件夾””或“新新建文件件”，接接著給新新的文件件夾或文文件命名名。202．．重重命命名名文文件件夾夾或或文文件件先選選中中需需要要重重命命名名的的文文件件夾夾或或文文件件，，然然后后單單擊擊右右鍵鍵，，在在彈彈出出的的快快捷捷菜菜單單中中單單擊擊““編編輯輯””選選項(xiàng)項(xiàng)的的下下級(jí)級(jí)菜菜單單中中的的““重重命命名名””命命令令或或者者按按【【F2】】快快捷捷鍵鍵，，文文件件夾夾或或文文件件的的名名稱稱變變?yōu)闉榭煽删幘庉嬢嫚顮顟B(tài)態(tài)，，重重新新輸輸入入新新的的名名稱稱，，按按Enter鍵鍵確確認(rèn)認(rèn)即即可可。。3．移動(dòng)和復(fù)復(fù)制文件從“文件”面面板的本地站站點(diǎn)文件列表表中，選中要要移動(dòng)或復(fù)制制的文件夾或或文件，如果果要進(jìn)行移動(dòng)動(dòng)操作，在彈彈出的快捷菜菜單中單擊““編輯”選項(xiàng)項(xiàng)的下級(jí)菜單單中的“剪切切”命令；如如果要進(jìn)行復(fù)復(fù)制操作，則則執(zhí)行“編輯輯”選項(xiàng)的““拷貝”命令令，然后執(zhí)行行“編輯”選選項(xiàng)下的“粘粘貼”命令，，將文件夾或或文件移動(dòng)或或復(fù)制到相應(yīng)應(yīng)的文件夾中中。4．刪除文件件夾或文件要從本地站點(diǎn)點(diǎn)文件列表中中刪除文件夾夾或文件，先先選中要?jiǎng)h除除的文件夾或或文件，然后后執(zhí)行“編輯輯”選項(xiàng)同上上的“刪除””命令或按Delete鍵，這時(shí)系系統(tǒng)會(huì)彈出一一個(gè)提示對(duì)話話框，詢問是是否要真正刪刪除文件夾或或文件，單擊擊“是”按鈕鈕確認(rèn)后即可可將文件夾或或文件從本地地站點(diǎn)中刪除除。211.3網(wǎng)頁(yè)頁(yè)文件的基本本操作創(chuàng)創(chuàng)建網(wǎng)頁(yè)和和打開網(wǎng)頁(yè)保保存網(wǎng)頁(yè)在在瀏覽器中中預(yù)覽網(wǎng)頁(yè)22創(chuàng)創(chuàng)建網(wǎng)頁(yè)和和打開網(wǎng)頁(yè)1.新建網(wǎng)頁(yè)頁(yè)單擊“文件””菜單下“新新建”命令，，即可彈出““新建文檔””對(duì)話框。從從“類別”列列表框中選擇擇“基本頁(yè)””選項(xiàng)，然后后選擇“基本本頁(yè)”列表框框中的“HTML”選項(xiàng)項(xiàng)。單擊“創(chuàng)創(chuàng)建”按鈕，，即可新建一一個(gè)空白的HTML網(wǎng)頁(yè)頁(yè)文檔。232.打打開網(wǎng)網(wǎng)頁(yè)單擊““文件件”菜菜單選選擇““打開開”命命令，，彈出出“打打開””對(duì)話話框。。在該該對(duì)話話框內(nèi)內(nèi)選中中要打打開的的HTML文檔檔，單單擊““打開開”按按鈕，，即可可將選選定的的HTML文檔檔打開開。也也可以以在““文件件”面面板上上，雙雙擊““站點(diǎn)點(diǎn)目錄錄”中中的網(wǎng)網(wǎng)頁(yè)文文件也也可以以打開開網(wǎng)頁(yè)頁(yè)文件件。241.3.2保存存網(wǎng)頁(yè)在完成創(chuàng)創(chuàng)建、編編輯的網(wǎng)網(wǎng)頁(yè)之后后，關(guān)鍵鍵的一步步就是保保存網(wǎng)頁(yè)頁(yè)，否則則一切都都是徒勞勞的，保保存網(wǎng)頁(yè)頁(yè)有如下下幾種方方法：?jiǎn)螕簟拔奈募辈瞬藛芜x擇擇“保存存”命令令，可以以原名字字原路徑徑保存當(dāng)當(dāng)前的文文檔。單擊“文文件”菜菜單選擇擇“另保保存”命命令，可可彈出““另存為為”對(duì)話話框。利利用該對(duì)對(duì)話框可可以將當(dāng)當(dāng)前的文文檔以其其他名字字保存。。單擊“文文件”菜菜單選擇擇“保存存全部””命令，，可將當(dāng)當(dāng)前正在在編輯的的所有文文檔以原原名保存存。251.3.3在瀏瀏覽器中中預(yù)覽網(wǎng)網(wǎng)頁(yè)單擊標(biāo)準(zhǔn)準(zhǔn)工具欄欄上的預(yù)預(yù)覽按鈕鈕或按““F12”可在在瀏覽器器中預(yù)覽覽所編輯輯的網(wǎng)頁(yè)頁(yè)。261.4設(shè)設(shè)置頁(yè)頁(yè)面屬性性步驟1：：打開Dreamweaver8.0，新新建一個(gè)個(gè)網(wǎng)頁(yè)，，或者打打開一個(gè)個(gè)現(xiàn)有的的網(wǎng)頁(yè)，，選擇““修改””菜單下下的“頁(yè)頁(yè)面屬性性”命令令，或者者單擊屬屬性面板板中的““頁(yè)面屬屬性”按按鈕，打打開“頁(yè)頁(yè)面屬性性”對(duì)話話框。27步驟驟2：：在在““頁(yè)頁(yè)面面屬屬性性””對(duì)對(duì)話話框框中中設(shè)設(shè)置置““外外觀觀””參參數(shù)數(shù)，，選選擇擇““頁(yè)頁(yè)面面屬屬性性””中中的的““外外觀觀””選選項(xiàng)項(xiàng)同同，，在在右右側(cè)側(cè)可可能能設(shè)設(shè)置置具具體體的的參參數(shù)數(shù)。。28步驟驟3：：頁(yè)頁(yè)面面屬屬性性設(shè)設(shè)置置完完成成后后，，單單擊擊““確確定定””保保存存設(shè)設(shè)置置，，然然后后中中再再打打開開““頁(yè)頁(yè)面面屬屬性性””對(duì)對(duì)話話框框，，并并選選擇擇左左側(cè)側(cè)的的““分分類類””列列表表中中的的““鏈鏈接接””選選項(xiàng)項(xiàng)同同，，在在右右側(cè)側(cè)可可以以對(duì)對(duì)鏈鏈接接的的樣樣式式進(jìn)進(jìn)行行詳詳細(xì)細(xì)的的設(shè)設(shè)置置。。291.5練練習(xí)制制作簡(jiǎn)單單的網(wǎng)頁(yè)頁(yè)站點(diǎn)1.創(chuàng)建建一個(gè)名名為“計(jì)計(jì)算機(jī)基基礎(chǔ)精品品課程””的站點(diǎn)點(diǎn)，將其其中的本本地站點(diǎn)點(diǎn)保存在在“D:﹨computer”文件件夾下，，遠(yuǎn)程站站點(diǎn)保存存在“D:﹨computer”文文件夾下下。根據(jù)據(jù)如圖所所示的網(wǎng)網(wǎng)站的邏邏輯圖，，為“計(jì)計(jì)算機(jī)基基礎(chǔ)精品品課程””網(wǎng)站建建立一個(gè)個(gè)存放圖圖片的文文件夾““images”，并并新建名名為“index.html”、““teacher.html”、““jiaoxue.html”、““shiyan.html””、“rili.html””、“kejian.html”和和“l(fā)uxiang.html”的的網(wǎng)頁(yè)文文件，最最后設(shè)置置index.html的頁(yè)頁(yè)面屬性性。302.創(chuàng)創(chuàng)建一個(gè)個(gè)“個(gè)