網(wǎng)頁設計與制作應用教程第3章AdobeDreamweaveCS3入課件

網(wǎng)頁設計與制作應用教程機械工業(yè)出版社同名教材配套電子課件2009.4網(wǎng)頁設計與制作應用教程機械工業(yè)出版社同名教材1第3章AdobeDreamweaveCS3入門知識3.1Dreamweave

概述3.2AdobeDreamweaveCS3工作環(huán)境3.3站點的建立3.4站點文件的基本操作3.5邊學邊做第3章AdobeDreamweaveCS3入門知識23.1Dreamweave

概述

Dreamweave特點Dreamweave是一款專業(yè)的HTML編輯器，它的功能特點如下：可視化編輯功能高效的站點管理全面的編碼環(huán)境支持服務器功能擴展功能3.1Dreamweave概述Dreamweave特33.2AdobeDreamweaveCS3工作環(huán)境工作區(qū)布局選擇3.2AdobeDreamweaveCS3工作環(huán)境工43.2AdobeDreamweaveCS3工作環(huán)境“設計器”工作區(qū)布局3.2AdobeDreamweaveCS3工作環(huán)境“53.2AdobeDreamweaveCS3工作環(huán)境Dreamweaver的工作區(qū)組成:

文檔窗口“插入”欄文檔工具欄面板組標簽選擇器“屬性”面板“文件”面板3.2AdobeDreamweaveCS3工作環(huán)境D63.2AdobeDreamweaveCS3工作環(huán)境“插入”欄文檔工具欄A.顯示代碼視圖

B.顯示代碼視圖和設計視圖C.顯示設計視圖

D.文檔標題

E.文件管理

F.在瀏覽器中預覽/調(diào)試G.刷新設計視圖H.視圖選項

I.可視化助理J.驗證標記 K.檢查瀏覽器兼容性3.2AdobeDreamweaveCS3工作環(huán)境“73.2AdobeDreamweaveCS3工作環(huán)境狀態(tài)欄屬性面板3.2AdobeDreamweaveCS3工作環(huán)境狀83.2AdobeDreamweaveCS3工作環(huán)境“文件”面板3.2AdobeDreamweaveCS3工作環(huán)境“93.2AdobeDreamweaveCS3工作環(huán)境菜單功能

文件菜單編輯菜單視圖菜單插入菜單站點菜單窗口菜單幫助菜單快捷菜單3.2AdobeDreamweaveCS3工作環(huán)境菜103.2AdobeDreamweaveCS3工作環(huán)境自定義DreamweavrCS3工作區(qū)

1、顯示和隱蔽面板3.2AdobeDreamweaveCS3工作環(huán)境自113.2AdobeDreamweaveCS3工作環(huán)境2、設置Dreamweaver的首選參數(shù)

3.2AdobeDreamweaveCS3工作環(huán)境123.2AdobeDreamweaveCS3工作環(huán)境顯示和隱藏歡迎屏幕3.2AdobeDreamweaveCS3工作環(huán)境顯133.3站點的建立建立站點的目的就是為了有效的組織管理設計網(wǎng)頁所需要的各種元素。站點需要一個名稱和存儲位置也就是目錄，它可以是存儲磁盤的任何位置。站點有網(wǎng)絡服務器中的站點（即遠程站點）和本地站點兩種創(chuàng)建形式。3.3站點的建立建立站點的目的就是為了有效的組織管理設計網(wǎng)143.3站點的建立選擇主菜單【站點】/【新建站點】命令，在文本框內(nèi)輸入站點的名稱，單擊“確定”按鈕3.3站點的建立選擇主菜單【站點】/【新建站點】命令，在153.3站點的建立如果要使用服務器技術（如：ASP等），可單擊選擇第二個單選項，否則默認選擇第一個單選項。單擊“下一步”。3.3站點的建立如果要使用服務器技術（如：ASP等），可單163.3站點的建立選擇在本地編輯還是在服務器編輯。并在文本框中指定站點文件夾的位置。單擊“下一步”。3.3站點的建立選擇在本地編輯還是在服務器編輯。并在文本框173.3站點的建立選擇如何連接到服務器。選擇是否啟用存回和取出模式。3.3站點的建立選擇如何連接到服務器。選擇是否啟用存回和取183.3站點的建立總結(jié)新創(chuàng)建的站點的所有設置信息，確認后單擊“完成”按鈕。“文件”面板會顯示出新創(chuàng)建的站點文件夾。3.3站點的建立總結(jié)新創(chuàng)建的站點的所有設置信息，確認后單擊193.3站點的建立創(chuàng)建站點目錄和文件操作方法可以是：在“文件”面扳中右鍵擊“我的網(wǎng)站”站點，在彈出的快捷菜單中執(zhí)行“新建文件（或新建文件夾）”命令。在出現(xiàn)文本框中重命名文件名（或文件夾名稱），這樣就方便地達到了有序管理所有站點資源的目的3.3站點的建立創(chuàng)建站點目錄和文件203.3站點的建立修改站點信息選擇主菜單【站點】/【管理站點】目錄，彈出“管理站點”對話框，如圖所示。單擊需要修改的站點名稱，再單擊“編輯”按鈕，即可再次彈出“站點定義”對話框，然后重新進行站點設置。

3.3站點的建立修改站點信息213.3站點的建立站點視圖單擊“文件”面板中的“展開/折疊”按鈕（），將站點文件窗口展開為最大化。對窗口可以調(diào)整查看區(qū)域的大小，并利用該窗口更改站點視圖方式。如圖所示的是分別以“站點文件”視圖方式和“站點地圖和文件”視圖方式查看站點信息。3.3站點的建立站點視圖223.4站點文件的基本操作

創(chuàng)建和打開文檔1、新建文檔2、打開文檔3、保存文檔3.4站點文件的基本操作創(chuàng)建和打開文檔233.4站點文件的基本操作管理文件和文件夾文件”面板功能十分重要，它可以用于：訪問站點、服務器和本地驅(qū)動器、查看文件和文件夾、管理文件和文件夾，以及使用站點的可視化地圖等工作。在“文件”面板中，可以及時處理站點文件和文件夾，如：打開文件、更改文件名；添加、移動或刪除文件；在進行更改后刷新“文件”面板。對于Dreamweaver站點，還可以確定哪些文件（本地站點或遠程站點上）在上次傳輸后進行了更新。在“文件”面板中，選擇一個文件或文件夾。右鍵單擊，在彈出的快捷菜單中選擇“新建文件”或“新建文件夾”選項；輸入新文件或新文件夾的名稱，按“Enter”鍵即可創(chuàng)建新的文件（文件夾）。3.4站點文件的基本操作管理文件和文件夾243.4站點文件的基本操作3.4站點文件的基本操作253.5邊學邊做（用DreamweaverCS3打開并瀏覽網(wǎng)頁）從“開始”按鈕的彈出菜單中選擇AdobeDreamweaverCS3，啟動軟件。單擊“歡迎”屏幕中“打開最近的項目”底部的“打開”按鈕。在“打開”對話框中選擇“index1.html”文檔，并確認打開，如圖所示，此時窗口默認以“設計視圖”方式顯示文檔編輯內(nèi)容。3.5邊學邊做（用DreamweaverCS3打開并瀏263.5邊學邊做（用DreamweaverCS3打開并瀏覽網(wǎng)頁）3.5邊學邊做（用DreamweaverCS3打開并瀏273.5邊學邊做（用DreamweaverCS3打開并瀏覽網(wǎng)頁）在Dreamweaver中，單擊“文檔”工具欄中“代碼視圖”按鈕，窗口顯示如圖所示。3.5邊學邊做（用DreamweaverCS3打開并瀏283.5邊學邊做（用DreamweaverCS3打開并瀏覽網(wǎng)頁）單擊“拆分視圖”按鈕，窗口顯示如圖所示。3.5邊學邊做（用DreamweaverCS3打開并瀏293.5邊學邊做（用DreamweaverCS3打開并瀏覽網(wǎng)頁）單擊“文檔”工具欄中預覽按鈕，如圖所示，在瀏覽器窗口中獲得網(wǎng)頁效果。也可以按F12瀏覽網(wǎng)頁。3.5邊學邊做（用DreamweaverCS3打開并瀏303.5邊學邊做（用DreamweaverCS3打開并瀏覽網(wǎng)頁）思考與練習描述改變面板的大小、位置的操作方法。簡述屬性面板的作用。描述文件打開、存儲的操作過程。創(chuàng)建站點的基本步驟是什么？簡述站點視圖的幾種查看方式？創(chuàng)建一個個人主頁站點。3.5邊學邊做（用DreamweaverCS3打開并瀏31網(wǎng)頁設計與制作應用教程機械工業(yè)出版社同名教材配套電子課件2009.4網(wǎng)頁設計與制作應用教程機械工業(yè)出版社同名教材32第3章AdobeDreamweaveCS3入門知識3.1Dreamweave

概述3.2AdobeDreamweaveCS3工作環(huán)境3.3站點的建立3.4站點文件的基本操作3.5邊學邊做第3章AdobeDreamweaveCS3入門知識333.1Dreamweave

概述

Dreamweave特點Dreamweave是一款專業(yè)的HTML編輯器，它的功能特點如下：可視化編輯功能高效的站點管理全面的編碼環(huán)境支持服務器功能擴展功能3.1Dreamweave概述Dreamweave特343.2AdobeDreamweaveCS3工作環(huán)境工作區(qū)布局選擇3.2AdobeDreamweaveCS3工作環(huán)境工353.2AdobeDreamweaveCS3工作環(huán)境“設計器”工作區(qū)布局3.2AdobeDreamweaveCS3工作環(huán)境“363.2AdobeDreamweaveCS3工作環(huán)境Dreamweaver的工作區(qū)組成:

文檔窗口“插入”欄文檔工具欄面板組標簽選擇器“屬性”面板“文件”面板3.2AdobeDreamweaveCS3工作環(huán)境D373.2AdobeDreamweaveCS3工作環(huán)境“插入”欄文檔工具欄A.顯示代碼視圖

B.顯示代碼視圖和設計視圖C.顯示設計視圖

D.文檔標題

E.文件管理

F.在瀏覽器中預覽/調(diào)試G.刷新設計視圖H.視圖選項

I.可視化助理J.驗證標記 K.檢查瀏覽器兼容性3.2AdobeDreamweaveCS3工作環(huán)境“383.2AdobeDreamweaveCS3工作環(huán)境狀態(tài)欄屬性面板3.2AdobeDreamweaveCS3工作環(huán)境狀393.2AdobeDreamweaveCS3工作環(huán)境“文件”面板3.2AdobeDreamweaveCS3工作環(huán)境“403.2AdobeDreamweaveCS3工作環(huán)境菜單功能

文件菜單編輯菜單視圖菜單插入菜單站點菜單窗口菜單幫助菜單快捷菜單3.2AdobeDreamweaveCS3工作環(huán)境菜413.2AdobeDreamweaveCS3工作環(huán)境自定義DreamweavrCS3工作區(qū)

1、顯示和隱蔽面板3.2AdobeDreamweaveCS3工作環(huán)境自423.2AdobeDreamweaveCS3工作環(huán)境2、設置Dreamweaver的首選參數(shù)

3.2AdobeDreamweaveCS3工作環(huán)境433.2AdobeDreamweaveCS3工作環(huán)境顯示和隱藏歡迎屏幕3.2AdobeDreamweaveCS3工作環(huán)境顯443.3站點的建立建立站點的目的就是為了有效的組織管理設計網(wǎng)頁所需要的各種元素。站點需要一個名稱和存儲位置也就是目錄，它可以是存儲磁盤的任何位置。站點有網(wǎng)絡服務器中的站點（即遠程站點）和本地站點兩種創(chuàng)建形式。3.3站點的建立建立站點的目的就是為了有效的組織管理設計網(wǎng)453.3站點的建立選擇主菜單【站點】/【新建站點】命令，在文本框內(nèi)輸入站點的名稱，單擊“確定”按鈕3.3站點的建立選擇主菜單【站點】/【新建站點】命令，在463.3站點的建立如果要使用服務器技術（如：ASP等），可單擊選擇第二個單選項，否則默認選擇第一個單選項。單擊“下一步”。3.3站點的建立如果要使用服務器技術（如：ASP等），可單473.3站點的建立選擇在本地編輯還是在服務器編輯。并在文本框中指定站點文件夾的位置。單擊“下一步”。3.3站點的建立選擇在本地編輯還是在服務器編輯。并在文本框483.3站點的建立選擇如何連接到服務器。選擇是否啟用存回和取出模式。3.3站點的建立選擇如何連接到服務器。選擇是否啟用存回和取493.3站點的建立總結(jié)新創(chuàng)建的站點的所有設置信息，確認后單擊“完成”按鈕?！拔募泵姘鍟@示出新創(chuàng)建的站點文件夾。3.3站點的建立總結(jié)新創(chuàng)建的站點的所有設置信息，確認后單擊503.3站點的建立創(chuàng)建站點目錄和文件操作方法可以是：在“文件”面扳中右鍵擊“我的網(wǎng)站”站點，在彈出的快捷菜單中執(zhí)行“新建文件（或新建文件夾）”命令。在出現(xiàn)文本框中重命名文件名（或文件夾名稱），這樣就方便地達到了有序管理所有站點資源的目的3.3站點的建立創(chuàng)建站點目錄和文件513.3站點的建立修改站點信息選擇主菜單【站點】/【管理站點】目錄，彈出“管理站點”對話框，如圖所示。單擊需要修改的站點名稱，再單擊“編輯”按鈕，即可再次彈出“站點定義”對話框，然后重新進行站點設置。

3.3站點的建立修改站點信息523.3站點的建立站點視圖單擊“文件”面板中的“展開/折疊”按鈕（），將站點文件窗口展開為最大化。對窗口可以調(diào)整查看區(qū)域的大小，并利用該窗口更改站點視圖方式。如圖所示的是分別以“站點文件”視圖方式和“站點地圖和文件”視圖方式查看站點信息。3.3站點的建立站點視圖533.4站點文件的基本操作

創(chuàng)建和打開文檔1、新建文檔2、打開文檔3、保存文檔3.4站點文件的基本操作創(chuàng)建和打開文檔543.4站點文件的基本操作管理文件和文件夾文件”面板功能十分重要，它可以用于：訪問站點、服務器和本地驅(qū)動器、查看文件和文件夾、管理文件和文件夾，以及使用站點的可視化地圖等工作。在“文件”面板中，可以及時處理站點文件和文件夾，如：打開文件、更改文件名；添加、移動或刪除文件；在進行更改后刷新“文件”面板。對于Dreamweaver站點，還可以確定哪些文件（本地站點或遠程站點上）在上次傳輸后進行了更新。在“文件”面板中，選擇一個文件或文件夾。右鍵單擊，在彈出的快捷菜單中選擇“新建文件”或“新建文件夾”選項；輸入新文件或新文件夾的名稱，按“Enter”鍵即可創(chuàng)建新的文件（文件夾）。3.4站點文件的基本操作管理文件和文件夾553.4站點文件的基本操作3.4站點文件的基本操作563.5邊學邊做（用DreamweaverCS3打開并瀏覽