Dreamweaver CS5網頁製作教程

在網頁設計中，通常需要使用Dreamweaver 軟件完成編輯，其中Dreamweaver CS 5爲廣泛使用版本，但Dreamweaver 軟件不像MIcrosoft Office 一樣全靠可視化完成，而是需要一定的技術性，對於新手來說，需要掌握一定的常識，才能製作出一個很好的網頁。

操作方法

（01）爲方便操作，將視圖設爲經典模式

（02）首先爲更好地管理網頁，需要將網頁用站點進行統一管理，因此要先新建站點：點擊 站點-新建站點

（03）設定好站點名稱和本地存儲位置，點擊“儲存”

（04）此時，Dreamweaver 將自動生成一個站點檔案夾，右擊檔案夾可進行編輯，如創建檔案和檔案夾。注：若要刪除其中的檔案或檔案夾，則先單擊欲刪除的項目，再按<Delete>鍵，此時本地檔案中的源檔案仍存在。要先將需要使用的素材先統一拷貝到站點檔案夾中，再點擊站點空口的“重新載入”按鈕，建立需要的網頁頁面。注：任何檔案名都不能使用中文或空格，否則會造成讀取錯誤。

（05）開啟需要編輯的HTML檔案，在設計視圖選項可設定視圖樣式：“代碼”爲原始碼編輯視圖；“拆分”爲原始碼與設計視圖並存，方便實時預覽網頁效果；“設計”爲全可視化編輯。

（06）網頁設計需要使用可視化與原始碼編輯相結合佈局，對初學者建議使用表格佈局，此方法最便於掌握，操作起來速度快。插入表格：直接點擊快速工具中表格命令；按快速鍵<Ctrl>+<Alt>+<T> 插入；點擊 插入-表格 插入

（07）根據自己需要設定表格屬性

（08）選中表格，在“屬性”控制面板中可設定表格屬性。點擊具體單元格可對其單獨設定屬性和編輯內容若需要合併/拆分單元格，則選中需要執行操作的單元格，點擊“屬性”視窗中相應命令即可寬/高 屬性可直接設定相應單元格的行高/列寬，其單位爲像素（單位：px）

（09）向表格中輸入需要的文字即可，若需要輸入的效果與實際輸入計算機的不符，則需要用代碼完成，讀者可自行查閱相關HTML代碼表，注意輸入代碼時需要結束標識。內容輸入完畢後，選中表格，在“屬性”中將其間距和邊框均設定爲0，即可保留佈局效果，此時在瀏覽器中將不顯示錶格框線，僅保留佈局效果。

（10）對一個網頁中含多個頁面的，則使用框架佈局