教學課題：Dreamweaver CS5簡介及工作界面
教學目標：1、初識Dreamweaver CS5軟件。
2、熟悉Dreamweaver CS5的窗口界面。
教學重點：Dreamweaver CS5的窗口界面。
教學難點：Dreamweaver CS5的窗口界面
教學方法：任務驅(qū)動法、小組合作學習法。
教學課時：1節(jié)
教學過程：
1、導入：略
2、講解新課
Dreamweaver 最初是由美國的Macromedia公司推出的一個“所見即所得”的網(wǎng)站開發(fā)工具。2005年，Macromedia公司被Adobe公司收購，其軟件的版本號也逐步和Adobe系列軟件相統(tǒng)一。
Dreamweaver不僅僅是優(yōu)秀的“所見即所得”的編輯軟件，它還兼顧HTML源代碼編輯，用戶可以在兩種不同的模式之間切換，滿足初學者和開發(fā)者不同的需求。Dreamweaver還有許多出色的設計理念，如行為、時間軸和資源等，可以讓用戶無需編寫復雜的代碼，就能輕松地設計出各種動態(tài)效果。
Dreamweaver CS5是Dreamweaver的最新版本，作為業(yè)界領先的網(wǎng)頁開發(fā)軟件，其在Dreamweaver CS4的基礎上增加了許多激動人心的新功能
- 支持HTML 5
- 檢查瀏覽器兼容性
- 集成CMS支持
- 檢查動態(tài)網(wǎng)頁
- Widget插件支持
- 多屏幕預覽
- PHP自定義代碼提示
教學課題：Dreamweaver CS5的工作界面
教學目標：熟悉Dreamweaver CS5的窗口界面。
教學重點： Dreamweaver CS5的窗口界面
教學難點：屬性面板和浮動面板組
教學方法：任務驅(qū)動法、小組合組學習法。
教學課時：1節(jié)
教學過程：1、導入新課：略
2、講解新課：
在首次啟動Dreamweaver CS5時，將顯示【Dreamweaver 起始頁】界面，幫助用戶快速創(chuàng)建常用的項目文檔，或者打開已有的文檔等（如圖1-1所示）。如果希望不再顯示起始頁，可選擇“編輯”-“首選參數(shù)”命令，彈出“首選參數(shù)”對話框，取消選擇“顯示歡迎屏幕”復選框，單擊“確定”按鈕完成設置。再次啟動Dreamweaver CS5后，將不再顯示起始畫畫。勾選起始頁上的“不再顯示”選框，也可以不再顯示起始畫面。
Dreamweaver CS5的工作界面（如圖1-2所示），包括標題欄、菜單欄、工具欄、插入欄、編輯窗口、屬性面板和浮動面板組七個部分。
圖1-1
圖1-2
1.2.1 Dreamweaver CS5的標題欄（如圖1-3所示）：
標題欄位于工作區(qū)的上部，包括軟件的標識按鈕、工作區(qū)布局選擇菜單、搜索框、CS Live服務菜單以及窗口控制按鈕（最大化、最小化和關閉按鈕）。
圖1-3
1.2.2 Dreamweaver CS5的菜單欄（如圖1-4所示）：
菜單欄共有10個菜單，即“文件”、“編輯”、“查看”、“插入”、“修改”、“格式”、“命令”、“站點”、“窗口”、“幫助”。
圖1-4
1.2.3 Dreamweaver CS5的快捷工具欄（如圖1-5所示）：
快捷工具欄位于菜單欄下面，包括“插入”、“文檔”、和“標準”三項。
- “插入”快捷工具欄，共有8類對象控制工具，即：“常用”、“布局”、“表單”、“數(shù)據(jù)”、“Spy”、“InContext Editing”、“文本”、“收藏夾”。
- “文檔”快捷工具欄，共有11個功能按鈕，即：“代碼”按鈕、“拆分”按鈕、“設計”按鈕、“、實時代碼”按鈕、“檢查瀏覽器兼容性
” 按鈕、“實時視圖”按鈕、“檢查”按鈕、“在瀏覽器中預覽/調(diào)試 
” 按鈕、“可視化助理 
” 按鈕、“刷新設計視圖 
” 按鈕、“標題”文本框。
- “標準”快捷工具欄，包括一些常用的操作按鈕，即：“新建”、“打開”、“瀏覽”、“保存”、“全部保存”、“打印代碼”、“剪切”、“復制”、“粘貼”、“撤銷”、“重做”等按鈕。
圖1-5
1.2.4網(wǎng)頁編輯區(qū)(如圖1-6所示):
在快捷工具欄下面的區(qū)域就是網(wǎng)頁編輯區(qū)，用戶可以在此區(qū)域?qū)W(wǎng)頁內(nèi)容進行編輯。如輸入文字、插入表格、插入圖片、插入動畫等。
圖1-6
1.2.5“屬性”面板(如圖1-7所示):
圖1-7
屬性面板位于網(wǎng)頁編輯區(qū)的下方，網(wǎng)頁中的不同對象有不同的屬性，屬性面板會隨著網(wǎng)頁編輯區(qū)內(nèi)對象的不同而變化。如：文字有字體、字號、對齊方式等屬性，圖像有大小、鏈接、替換文字等屬性，F(xiàn)lash動畫也有相應的屬性面板。
1.2.6浮動面板(如圖1-8所示):
其他面板統(tǒng)稱為浮動面板，它們浮動于編輯窗口之外，可以放置在屏幕的任何位置。按F4鍵可以將浮動面板隱藏，再按F4鍵，隱藏起來的浮動面板又會在原來的位置出現(xiàn)。
圖1-8
3、作業(yè)：上機熟悉Dreamweaver CS5的工作界面。
