實例5 新世紀海灣網頁（一）

實例說明 在本實例和實例6中將指導讀者制作一個新世紀海灣網頁，該網頁使用了大量的文本信息，為了使網頁更美觀，在本實例中將設置默認字體的基本屬性。通過本實例的學習，使讀者掌握頁面屬性中標題的設置方法。

技術要點 在本實例中，首先導入背景圖像，然后置入文本的屬性，完成該網頁的制作。圖5-1所示為本實例完成后的效果。

1 將本書附帶光盤中的“網頁基礎設置/實例5~6：新世紀海灣網頁”文件夾復制到本地站點路徑內。

2 運行Dreamweaver CS4，打開復制的“實例5~6：新世紀海灣網頁”文件夾中的“新世紀海灣網頁源文件．html”，如圖5-2所示，將該文件另存在本地站點路徑內，然后將其命名為“新世紀海灣網頁”。

3 插入背景圖像。在第一行單元格內單擊，執行菜單欄內的“插入”/“圖像”命令，打開“選擇圖像源文件”對話框，從該對話框中選擇復制的“實例5~6：新世紀海灣網頁”文件夾中的material.jpg文件，如圖5-3所示，單擊“確定”按鈕，退出該對話框。

4 單擊“屬性”面板中的“頁面屬性”按鈕，打開“頁面屬性”對話框，在“分類”顯示窗中選擇“標題（CSS）”選項，在“頁面屬性”對話框中會顯示“標題（CSS）”編輯窗，選擇“標題字體”下拉選項欄中的“編輯字體列表”選項，如圖5-4所示。

5 選擇“編輯字體列表”選項后，打開“編輯字體列表”對話框，在“可用字體”下拉選項欄中選擇“方正北魏楷書繁體”選項，如圖5-5所示。然后單擊該對話框中的按鈕，加載字體樣式，單擊“確定”按鈕，退出該對話框。

6 退出“編輯字體列表”對話框后，再次在“頁面屬性”對話框中的“標題字體”下拉選項欄中選擇“方正北魏楷書繁體”選項，設置標題字體樣式，如圖5-6所示。

7 在“頁面屬性”對話框中的“標題1”參數欄中鍵入60，設置字體大小，將其右側顏色顯示窗中的顏色設置為黃色（#FF9），設置字體顏色，如圖5-7所示。

8 使用同樣的方法，在“標題2”參數欄中鍵入20，將其右側顏色顯示窗中的顏色設置為粉紅色（#EDB4D9）；在“標題3”參數欄中鍵入20，將其右側顏色顯示窗中的顏色設置為黑色，如圖5-8所示。

9 現在本實例就制作完成了，圖5-9所示為本實例完成后的效果。保存本實例，以便在實例6中使用。