在設(shè)計網(wǎng)頁時，有了豐富的圖像素材，就可以利用Dreamweaver把這些圖像組織在一起，設(shè)計出具有一定審美效果的網(wǎng)頁頁面。
如何把所擁有的素材有機(jī)地組織在一起，在具體設(shè)計網(wǎng)頁之前用戶應(yīng)心中有數(shù)，最好在紙上隨意打個草稿，避免盲目操作。本頁布局簡明，結(jié)構(gòu)也不是太復(fù)雜，但對于初學(xué)者來說仍然會存在不小的困難，下面就逐步介紹。
【操作步驟】
第1步，啟動Dreamweaver，新建一個網(wǎng)頁文件，保存為main.html。
提示：把上面制作的所有圖像素材都匯集到im-ages文件夾中，并保證該文件夾和main.html文件同處在一個目錄下。
第2步，在Dreamweaver文檔編輯窗口中，單擊窗口底部的【屬性】面板中的【頁面屬性】按鈕，如圖5.13所示。如果沒有顯示【屬性】面板，可以選擇【窗口】|【屬性】命令。
第3步，打開【頁面屬性】對話框，在【分類】列表框中選擇【常規(guī)】選項，然后在右側(cè)設(shè)置區(qū)域設(shè)置網(wǎng)頁的背景圖像，如圖5.14所示。第4步，設(shè)置完畢，單擊【確定】按鈕關(guān)閉【頁面屬性】對話框。
第5步，在編輯窗口中插入一個表格。選擇【插入】|【表格】命令，打開【表格】對話框，設(shè)置：1行2列，寬度800像素，邊框、單元格邊距和單元格間距都為0。
第6步，插入表格之后，在【屬性】面板中設(shè)置表格居中顯示。
第7步，把光標(biāo)置于插入表格的第1個單元格中，在【屬性】面板中設(shè)置第1個單元格寬為200像素。
第8步，選擇【插入】|【圖像】|【圖像】命令，在打開的【選擇圖像源文件】對話框中選擇要插入的LOGO圖標(biāo)。然后，把光標(biāo)置于第2個單元格中，以同樣的方法插入Banner廣告條，并設(shè)置該圖像在單元格中居中顯示。
前面完成了網(wǎng)站建設(shè)時網(wǎng)頁頁面的標(biāo)題設(shè)計，本節(jié)利用表格插入導(dǎo)航按鈕和制作圓角的修飾圖案。
【操作步驟】
第1步，把光標(biāo)置于第1個表格的后面，選擇【插入】|【表格】命令，插入一個表格，設(shè)置：1行2列，寬度800像素，邊框粗細(xì)、單元格間距和單元格邊距都為0。
第2步，插入表格之后，在【屬性】面板中設(shè)置表格居中顯示，同時設(shè)置第1個表格也居中顯示，并設(shè)置第2個表格的第1個單元格寬度為100。
第3步，在第1個單元格中插入一個8行1列的表格，設(shè)置寬度為100%，同時設(shè)置邊框粗細(xì)、單元格間距和單元格邊距都為0的表格。
第4步，在表格中按順序從上到下分別插入圓角圖案（border1.gif）、6個按鈕（about.jpg、ser-vices.jpg、gallery.jpg、freebies.jpg;、portfolio.jpg、contact.jpg）和圓角圖案（border2.gif）。
第5步，以同樣的方式在右邊單元格中插入一個3行3列的表格，設(shè)置表格寬度為98%，并在【屬性】面板中設(shè)置居中顯示。
第6步，在4個頂角的單元格中插入圓角修飾圖案，并設(shè)置單元格寬、高為圖案大小。
第7步，設(shè)置沒有插入圓角圖案的單元格背景顏色為圖案的顏色，即保持表格背景顏色的一致性。