250 likes | 464 Views
網頁設計與製作. 第二單元: Dreamweaver 的基本操作. 授課教師:王漢銘. NordriDesign 專業商務簡報設計. Dreamweaver 操作. 請至 Adobe Dreamweaver 官方教學網站,網址為 http://helpx.adobe.com/tw/dreamweaver/topics.html. Dreamweaver 操作.
E N D
網頁設計與製作 第二單元:Dreamweaver的基本操作 授課教師:王漢銘 NordriDesign專業商務簡報設計
Dreamweaver操作 • 請至AdobeDreamweaver官方教學網站,網址為http://helpx.adobe.com/tw/dreamweaver/topics.html
Dreamweaver操作 • Adobe Dreamweaver CS5原版官方使用手冊,下載網址為http://help.adobe.com/zh_TW/dreamweaver/cs/using/dreamweaver_cs5_help.pdf,請同學先下載後,先看一下。 • 也有CS6原版官方使用手冊,同學有興趣的,可以自行至網站上蒐尋。
認識Dreamweaver的工作區 • Dreamweaver可根據不同的網站工作屬性,切換成所需的工作環境。 • 為了加快操作速度、方便性或預設的工作區環境不適合網站屬性,常需要將工作區調整成符合自身的習慣。
認識Dreamweaver環境 • 由應用程式列、工具列、文件視窗、狀態列、屬性檢視窗、面板群組所組成。 • 應用程式列。 • 工具列。 • 文件視窗。 • 狀態列。 • 屬性檢視窗。 • 面板群組。
管理工作區 • 新增工作區 • 將浮動面板配置完成後,按下「工作區切換器\新增工作區」。 • 於「視窗\工作區版面\新增工作區」。
刪除工作區 • 若要刪除自行新增的工作區版面,請按下「工作區切換器\管理工作區」。 • 「視窗\工作區版面\管理工作區」。
應用程式列 • 有工作區切換器、功能表以及應用程式的其他控制項。
工具列 • 可提供如程式碼、分割、設計檢視等各種不同檢視選項、各種檢視選項,和一些常用的工作。 • 瀏覽器導覽工具列 • 文件工具列 • 編碼工具列 • 樣式呈現工具列
狀態列 • 文件視窗底部的狀態列提供現在所建立文件的其他資訊。
屬性檢視窗 • 屬性檢視窗可供您檢查及編輯目前選取之頁面元素的常用屬性,其內容會隨著選取的元素而不同。
面板群組 • 插入面板 • 包含將各種物件插入文件中所需的按鈕。每個物件都是片段的HTML 程式碼,當您將它插入文件時可在其中設定各種屬性。將游標移至三角形的圖示上並單點左鍵即可切換其他類別。
常用 • 常用類別:一般網頁上最常使用的物件都可由這裏來尋找,如影像和表格。
版面 • 版面類別:可讓您插入div標籤、Spry Widget、表格、表格元素、頁框。 • 您也可以選擇表格的兩種檢視: • 標準表格。 • 展開表格。
表單 • 表單類別:包含建立表單和插入表單元素所用的按鈕。
資料 • 資料類別:可讓您插入 Spry 資料物件以及其他動態元素,如資料集、重複區域以及記錄插入和更新表單。
Spry • Spry 類別:包含建立 Spry 頁面所用的按鈕。
文字 • 文字類別:可插入各種文字和清單格式的標籤。
排版輔助工具 • 尺規 • 格線 • 導引線
影像藍圖 • 是一個圖檔,放置在文件的背景中。 • 只有在Dreamweaver中看得到,在瀏覽器中看頁面時,是看不到的。
參考資料 • 文淵閣工作室(2012)。Dreamweaver CS6網頁製作比你想的簡單。台北市:碁峯資訊。 • 施威銘研究室(2012)。正確學會Dreamweaver CS6的十六堂課。台北市:旗標。
感謝您的聆聽 Thank you