【正文】 第 5章 網(wǎng)頁的定位技術(shù)本章主要介紹 創(chuàng)建表格的基本操作 表格的編輯與格式化 外部數(shù)據(jù)導(dǎo)入和表格排序 布局表格和布局單元格 層的創(chuàng)建和基本操作 層的屬性設(shè)置 100 層與表格互換 層的應(yīng)用實例 框架的基本操作 框架和框架集的選擇與屬性設(shè)置 框架和框架集的保存 框架應(yīng)用實例 本章摘要與重點回顧 表格不但在組織頁面數(shù)據(jù)時非常有用，而且在網(wǎng)頁元素布局安排上也起著重要的作用，利用表格可以控制文本和圖形等對象在頁面上的位置。網(wǎng)頁一般可用表格 (Table)、 層 (Layer)和框架 (Frame)來對網(wǎng)頁元素定位。 設(shè)計者用 Dreamweaver MX能很方便地在表格中輸入數(shù)據(jù)，對表格進(jìn)行修改，改變其外觀和結(jié)構(gòu)。可以增加、刪除、拆分、合并表格的單元格、行和列，可以修改單元格、行、列以及表格的屬性，實現(xiàn)表格的嵌套，表與層互相轉(zhuǎn)換等操作。 創(chuàng)建表格的基本操作 在網(wǎng)頁制作時要新建一個表格，可選擇【插入】 |【表格】命令，此時網(wǎng)頁編輯窗口中會彈出【插入表格】對話框，如圖 51所示。在此對話框中，可設(shè)置表格的屬性，然后單擊【確定】按鈕確認(rèn)屬性設(shè)置后，便可在頁面指定位置上插入表格。 新建表格 圖 51【插入表格】對話框 【插入表格】對話框中各項參數(shù)的具體意義如下： 在【行數(shù)】和【列數(shù)】文本框中，可設(shè)置表格的行數(shù)和列數(shù)； 在【單元格填充】文本框中，可設(shè)置單元格的內(nèi)容和單元格邊框之間空白處的寬度； 在【單元格間距】文本框中，可設(shè)置表格中各單元格之間的寬度； 在【寬度】文本框中，可設(shè)置表格的寬度，并在右側(cè)的下拉列表框中選擇表格寬度的單位，選項分別為像素和百分比，其中百分比是指表格與瀏覽器窗口的百分比； 在【邊框】文本框中，可設(shè)置表格外框線的寬度。 在網(wǎng)頁上插入一個表格后，可根據(jù)需要在某些單元格中插入文本或圖像等對象。在插入文字對象前必須先將光標(biāo)定位在該單元格中，然后可直接輸入文字或?qū)?fù)制在剪貼板中的文字對象粘貼到單元格內(nèi)。 在表格中插入圖像對象的方法是先將光標(biāo)定位在某一單元格內(nèi)，然后單擊【插入】浮動面板組的【常用】選項卡中的【圖像】按鈕； 或選擇【插入】 |【圖像】命令，在彈出的【選擇圖像源】對話框中選擇要插入的圖像文件和路徑，確認(rèn)后便可插入圖像。 1. 設(shè)置表格的屬性 新建表格后，可在表格屬性面板中設(shè)置表格屬性，來改變表格的外觀特性。 先在網(wǎng)頁編輯器窗口中選中整個表格，此時表格【屬性】面板如圖 52所示。 圖 52表格【屬性】面板 設(shè)置表格和單元格的屬性 表格【屬性】面板中參數(shù)的具體意義如下： (1)在【表格 Id】 文本框中可輸入表格名稱； (2)【行】、【列】、【寬】、【高】、【填充】、【間距】、【邊框】等參數(shù)設(shè)置方法與上述【插入表格】對話框的參數(shù)設(shè)置方法相同； (3)在【對齊】下拉列表框中，可選擇表格的對齊方式； (4)單擊【清除列寬】按鈕及【清除行高】按鈕，可清除表格【屬性】面板中行寬和列高的數(shù)據(jù)； (5)單擊【將表格寬度轉(zhuǎn)換成像素】按鈕和【將表格高度轉(zhuǎn)換成像素】按鈕，可將表格寬度和高度的單位由百分比方式轉(zhuǎn)換成像素； (6)單擊【將表格寬度轉(zhuǎn)換成百分比】按鈕和【將表格高度轉(zhuǎn)換成百分?jǐn)?shù)】按鈕，可將表格寬度和高度的單位由像素方式轉(zhuǎn)換成百分比； (7)在【背景顏色】和【邊框顏色】文本框中，可分別設(shè)置表格的背景顏色和邊框線的顏色； (8)在【背景圖像】文本框中，可輸入表格背景圖片的路徑和文件名。 2. 設(shè)置單元格的屬性 在表格的操作過程中，為了突出顯示某一部分?jǐn)?shù)據(jù)的重要性，常常會設(shè)置選中的行、列或者是某幾個單元格的屬性。選中一個或多個單元格后，打開單元格【屬性】面板，如圖 53所示。 圖 53單元格【屬性】面板 其中各項參數(shù)意義如下： (1)在【水平】和【垂直】下拉列表框中可以選擇單元格內(nèi)容的水平對齊和垂直對齊方式， 4種水平對齊方式為 “ 默認(rèn) ” 、 “ 左對齊 ” 、 “ 居中 ” 、“ 右對齊 ” ， 5種垂直對齊方式為 “ 默認(rèn) ” 、 “ 頂端對齊 ” 、 “ 中間對齊 ” 、 “ 底部對齊 ” 、 “ 基線對齊 ” ； (2)【寬】和【高】文本框中，可輸入以像素為單位的單元格的寬度和高度，若輸入的數(shù)據(jù)以百分比為單位，則可在數(shù)據(jù)后面加百分比符號 %； (3)選中【不換行】復(fù)選框，可設(shè)置文本自動換行； (4)選中【標(biāo)題】復(fù)選框，可將單元格設(shè)置為表格的標(biāo)題，默認(rèn)情況下，標(biāo)題單元格中的內(nèi)容將被設(shè)為粗體，并且居中對齊； (5)在【背景】文本框中，可設(shè)置背景圖片的文件名和路徑； (6)在【背景顏色】和【邊框】文本框中，可設(shè)置表格的背景顏色和邊框線的顏色； (7)單擊【合并所選的單元格】按鈕，可合并選中的單元格； (8)單擊【拆分單元格為行和列】按鈕，可拆分選中的單元格。 單元格【屬性】面板的上半部分與文字【屬性】面板相同，這些項的參數(shù)意義這里不再敘述。 要對表格進(jìn)行編輯操作，首先應(yīng)掌握表格行、列以及單元格的選擇方法。在 Dreamweaver MX中選擇表格元素的方法與在 MS Office 軟件中選擇表格元素的方法相同，下面介紹選擇表格元素的方法。 選取表格和單元格 1. 選擇單元格 (1) 選中某個單元格的 2種方法如下： 單元格中，當(dāng)被選中的單元格四周出現(xiàn)粗邊框線時釋放鼠標(biāo)，即可選中該單元格； 選擇器的 td， 便可選中該單元格。 (2) 選中多個相鄰的單元格的 2種方法如下： 1個單元格，然后拖動鼠標(biāo)到最后一個單元格，即可選中這組相鄰的單元格； 1個單元格，然后按住 Shift 鍵，再單擊這組相鄰單元格的最后一個單元格，就可選中這組相鄰的單元格。 (3) 選擇多個不相鄰的單元格的方法如下： 按住 Ctrl鍵，然后再分別單擊要選中的那些不相鄰的單元格，這時被單擊的單元格就可被選中，若在按住 Ctrl鍵的同時，再次單擊選中的單元格，將取消該單元格的選擇。 (4) 選擇表格行的 2種方法如下： 單擊可選中該行，此時如果拖動鼠標(biāo)可同時選擇多行； 選擇器的 tr， 便可選中該行。 (5) 選擇表格列的方法如下： 將鼠標(biāo)指向表格的上邊框線，當(dāng)光標(biāo)變話時，單擊可選中該列，此時如果拖動鼠標(biāo)可同時選擇多列。 2. 選擇表格 選擇整個表格有 4種方法： 擇器的 table， 便可選中該表格； |【表格】 |【選擇表格】命令，也可選中整個表格； Ctrl+A快捷鍵，也可選中整個表格； 格。 在 Dreamweaver MX中，對于表格的嵌套沒有特別的限制，表格完全可以像文本、圖像一樣直接插入到其他表格的單元格中，然后通過對單元格的拆分和合并等編輯操作，完成更復(fù)雜表格的嵌套操作。 將光標(biāo)插入當(dāng)前表格的某個單元格內(nèi)，然后可選擇【插入】 |【表格】命令，或單擊【插入】浮動面板的【常用】選項卡中的【插入表格】按鈕，在【插入表格】對話框中輸入新表格的屬性，便可以在當(dāng)前單元格內(nèi)再插入一個表格，這就是表格的嵌套操作。但是表格嵌套層數(shù)不宜過多。 表格的嵌套 改變表格或單元格的大小 在表格實際應(yīng)用中，往往會根據(jù)需要對表格的尺寸進(jìn)行調(diào)整。修改表格尺寸的方法有兩種： 一是用鼠標(biāo)拖曳表格線或表格的活動塊來調(diào)整表格的大?。? 二是用表格的【屬性】面板來修改表格尺寸。 表格的編輯與格式化 1. 用鼠標(biāo)拖拽調(diào)整表格大小 （ 1） 選中整個表格。 （ 2） 表格四周被黑色邊框線和 8個活動塊框住。 （ 3） 用鼠標(biāo)對準(zhǔn)活動塊，鼠標(biāo)變成雙向箭頭后拖曳活動塊，就可調(diào)整表格的尺寸。 （ 4） 將鼠標(biāo)指針指向要調(diào)整的行和列的邊框線。 （ 5） 此時鼠標(biāo)指針變?yōu)楹托螤睿弦肥髽?biāo)便可調(diào)整行高和列寬。 2. 用表格屬性面板調(diào)整表格行高及列寬 （ 1） 選中整個表格，在表格屬性面板中直接修改【寬】和【高】的數(shù)值，就可修改表格的尺寸。 （ 2） 選中某個單元格，在表格屬性面板中直接修改【寬】和【高】的數(shù)值，就可調(diào)整該單元格所在行、列的行高及列寬。 在網(wǎng)頁設(shè)計的過程中，常常會根據(jù)需要對表格中行、列進(jìn)行增加和刪除的操作，這類操作可以通過表格【屬性】面板和【修改】菜單來完成。 表格行、列的增加和刪除 1. 通過表格【屬性】面板增加與刪除表格的行和列 （ 1） 選中整個表格。