Dreamweaver MX 2004從零開始(3)
作者：Eve Cole
更新時間：2009-05-31 21:02:57
用框架建構網頁<BR> 我們登入一些論壇之後，可以看見左邊是每個討論區的名稱，點擊任意一個討論區就可以在右部區域中看見相應討論區的內容，不過左右部分是獨立顯示的，例如拖曳左邊的捲軸不會影響右邊的顯示效果。其實這就是頁面中利用了框架技術，因此可以把瀏覽器的顯示空間分割成幾個部分，每個部分都獨立顯示網頁內容。而且把幾個框架結合在一起構成框架集，能夠讓頁面有更豐富的效果。
一、創建框架和框架集
第一步：在Dreamweaver MX 2004中新建一個頁面，執行「View→Visual Aids→Frame Borders」指令之後可以看見編輯視窗中出現一個邊框，用滑鼠點選邊框之後可以看見虛線框，說明新建的頁面中已經附帶了框架。
第二步：按下「Alt」按鍵，用滑鼠拖曳邊框，放開滑鼠之後就可以把視窗一分為二，這樣就把頁面分為兩個邊框。例如拖曳左右邊框可以把視窗分成左右兩個部分，而拖曳上下邊框可以把視窗分為上下兩個部分。另外，窗口的四個角落也可以拖曳，這樣可以直接把視窗分成四個區域（如圖1）。當視窗分割成幾個框架之後，每個框架都可以當作獨立的網頁來編輯，也可以直接把某個已經存在的頁面賦給一個框架。
圖1
第三步：框架允許嵌套，例如要創建圖2所示的框架，可以先通過上述的方法水平一分為二，但是接著不能直接拖曳邊框，否則會得到圖1所示的框架。正確的方法是先在右下角的框架面板中點選右邊的框架，然後再按下「Alt」按鈕拖曳邊框。
圖2
小提示：如果邊框拖曳錯了，只要用滑鼠把需要刪除的線拖曳到父框架的邊框上即可刪除它。
二、編輯框架
頁面中經常混有框架和框架集，選取不同物件可以進行不同的屬性設定。
第一步：框架集的屬性。選取框架集之後可以看見屬性物件面板（如圖3），其中「Border」一個可以設定是否顯示邊框，「Border Width」一個可以設定邊框寬度，「Border Color」可以設定邊框的顏色。另外也可以設定每個邊框的尺寸，此時在面板右邊的縮圖中選定一行或一列，然後在它旁邊的“Alue”輸入框中輸入數值，並且選擇像素或百分比作為單位即可。
圖3
第二步：框架的屬性。如果在框架面板中選擇任一框架，在框架面板中被選取的框架會有黑色的邊框顯示，這時就可以在屬性面板中進行對應的設定了（如圖4）。例如在此可以透過「Src」網址列設定框架中的網頁文件，「Scroll」為是否加入滾動條，「Border」可以決定是否顯示邊框，「No resize」允許在瀏覽器是改變框架大小，另外「 Margin Width」和「Margin Height」分別設定邊界的寬度和高度來決定框架中內容和邊框的距離。
圖4
第三步：輸入框架中的內容。用滑鼠點選任一框架之後就可以像正常編輯頁面一樣插入各種文字內容、圖片、Flash動畫和背景音樂等網頁元素。
其實運用框架能夠對網頁版面進行合理規劃，尤其在設計網頁初期更顯得格外重要，因此需要大家在日常使用中多加練習，這對搭建一個優秀的網站可是大有裨益的！
