《中文版Dreamweaver CS5網(wǎng)頁(yè)設(shè)計(jì)實(shí)用教程》第12章 表格

中文版DreamweaverCS5網(wǎng)頁(yè)設(shè)計(jì)實(shí)用教程創(chuàng)建表格12.1第12章

表格12.3表格的高級(jí)編輯12.2編輯表格12.1創(chuàng)建表格在DreamweaverCS5中，創(chuàng)建表格的步驟如下：（1）新建一個(gè)HTML文檔。（2）切換“插入”面板到“常用”選項(xiàng)卡，如圖12-1所示。圖12-1“常用”選項(xiàng)卡12.1創(chuàng)建表格（3）單擊插入面板的“表格”按鈕（或執(zhí)行“插入/表格”命令），打開(kāi)“表格”對(duì)話框，如圖12-2所示。圖12-2“表格”對(duì)話框12.1創(chuàng)建表格（4）在“表格”對(duì)話框中設(shè)置行數(shù)為4，列數(shù)為5，表格寬度為300像素，邊框粗細(xì)為1像素。表格對(duì)話框中各項(xiàng)的含義如下。在“表格大小”欄中指定以下選項(xiàng)：行數(shù)：確定表格行的數(shù)目。列數(shù)：確定表格列的數(shù)目。表格寬度：以像素為單位或按占瀏覽器窗口寬度的百分比指定表格的寬度。邊框粗細(xì)：指定表格邊框的寬度（以像素為單位）。單元格邊距：確定單元格邊框和單元格內(nèi)容之間的距離（以像素為單位）。單元格間距：確定相鄰單元格之間的距離（以像素為單位）。12.1創(chuàng)建表格在“標(biāo)題”欄中選擇一個(gè)標(biāo)題選項(xiàng)：無(wú)：不啟用列或行標(biāo)題。左側(cè)：可以將表的第一列作為標(biāo)題列，以便在表中的每一行行首輸入一個(gè)標(biāo)題。頂部：可以將表的第一行作為標(biāo)題行，以便在表中的每一列列首輸入一個(gè)標(biāo)題。兩者：能夠在表中輸入列標(biāo)題和行標(biāo)題。在“輔助功能”欄中指定以下選項(xiàng)：標(biāo)題：提供了一個(gè)顯示在表格外的表格標(biāo)題。摘要：可以在此寫(xiě)出表格的說(shuō)明。通過(guò)屏幕閱讀器可以讀取摘要文本，但是該文本不會(huì)在瀏覽器中顯示。12.1創(chuàng)建表格（5）單擊“確定”按鈕，編輯窗口顯示4行5列表格，如圖12-3所示。圖12-3創(chuàng)建表格結(jié)果12.2編輯表格一、編輯表格和單元格屬性二、調(diào)整表格行數(shù)與列數(shù)三、設(shè)置表格的寬度和高度四、合并單元格五、拆分單元格六、單元格的內(nèi)部對(duì)齊方式一、編輯表格和單元格屬性1．表格屬性圖12-4表格屬性面板一、編輯表格和單元格屬性2．單元格屬性圖12-5單元格屬性面板二、調(diào)整表格行數(shù)與列數(shù)

創(chuàng)建表格后，調(diào)整表格行數(shù)與列數(shù)，有如下幾種方法：

方法一

選取表格，直接在屬性面板的行和列欄中輸入目標(biāo)的數(shù)值，如圖12-6所示。這種方法可以在現(xiàn)有表格的最下方和最右方插入（或刪除）行與列。圖12-6直接在屬性面板的行和列欄中輸入目標(biāo)的數(shù)值二、調(diào)整表格行數(shù)與列數(shù)

方法二

如圖12-7所示，移動(dòng)鼠標(biāo)指針到目標(biāo)單元格內(nèi)，單擊鼠標(biāo)右鍵，在彈出的菜單中選擇目標(biāo)操作命令。圖12-7選擇目標(biāo)操作命令二、調(diào)整表格行數(shù)與列數(shù)（1）要插入一行，執(zhí)行“修改/表格/插入行”命令，在插入點(diǎn)上方插入一行單元格。要?jiǎng)h除光標(biāo)所在行的一行單元格，執(zhí)行“修改/表格/刪除行”命令。（2）要插入一列，執(zhí)行“修改/表格/插入列”命令，在插入點(diǎn)左側(cè)插入一列單元格。要?jiǎng)h除光標(biāo)所在列的一列單元格，執(zhí)行“修改/表格/刪除列”命令。（3）要插入多行或者多列，執(zhí)行“修改/表格/插入行或列”命令，打開(kāi)“插入行或列”對(duì)話框，如圖12-8所示，輸入插入行或列的數(shù)目，選擇插入行或列的位置，單擊“確定”按鈕。圖12-8“插入行或列”對(duì)話框方法三單擊最后一行最右側(cè)的單元格，按【Tab】鍵，可以在表格末尾插入一行。三、設(shè)置表格的寬度和高度

設(shè)置表格的寬度，可以按下列兩種方法來(lái)完成：

方法一

選擇表格，在如圖12-9所示的屬性面板中選擇寬的長(zhǎng)度單位，然后在“寬”欄中輸入數(shù)值，按【Enter】鍵完成設(shè)置。圖12-9設(shè)置表格的寬度三、設(shè)置表格的寬度和高度

方法二

選取表格，拖動(dòng)圖12-9所示的表格控制點(diǎn)來(lái)改變表格的寬度和高度。移動(dòng)鼠標(biāo)指針到右側(cè)的表格控制點(diǎn)，鼠標(biāo)指針變形為選擇圖標(biāo)時(shí)，按住鼠標(biāo)左鍵并拖動(dòng)。下面以實(shí)例說(shuō)明設(shè)置表格高度的方法：（1）創(chuàng)建一個(gè)2行2列的表格，如圖12-10所示。圖12-10創(chuàng)建表格三、設(shè)置表格的寬度和高度（2）單擊表格的第一行的任意單元格內(nèi)部，在屬性面板中設(shè)置單元格的高度為50，按【Enter】鍵完成設(shè)置，結(jié)果如圖12-11所示。圖12-11設(shè)置單元格的高度三、設(shè)置表格的寬度和高度（3）使用同樣方法，設(shè)置第2行任意單元格的高度為80，最終結(jié)果如圖12-12所示。圖12-12設(shè)置表格的高度的效果三、設(shè)置表格的寬度和高度

單元格的寬和高會(huì)受到存放內(nèi)容的影響，因此，在設(shè)置表格時(shí)一定要設(shè)計(jì)好網(wǎng)頁(yè)內(nèi)容的寬和高。利用這一特點(diǎn)，可以在處理表格時(shí)，清除表格的行寬和列高，直接向其中導(dǎo)入內(nèi)容，讓表格根據(jù)內(nèi)容自動(dòng)調(diào)整寬度和高度。例如，選中表格，然后單擊表格的菜單按鈕，在彈出的菜單中選擇清除所有高度，如圖12-13所示。圖12-13清除所有高度四、合并單元格合并單元格是對(duì)表格最常用的操作之一，合并單元格的方法如下：（1）新建一個(gè)5行3列的表格，按住【Ctrl】鍵單擊相鄰的目標(biāo)單元格，如圖12-14所示。圖12-14選中目標(biāo)單元格四、合并單元格（2）單擊屬性面板中的“合并所選單元格，使用跨度”按鈕，合并單元格，結(jié)果如圖12-15所示。圖12-15合并單元格效果五、拆分單元格拆分一個(gè)單元格為兩個(gè)或兩個(gè)以上的單元格，可以使用以下方法：（1）接上例，在圖12-15中，將鼠標(biāo)指針移到目標(biāo)單元格內(nèi)部，單擊鼠標(biāo)。（2）單擊屬性面板的“拆分單元格為行或列”按鈕，彈出如圖12-16所示的“拆分單元格”對(duì)話框。（3）本例選擇“列”單選按鈕，設(shè)置列數(shù)為3，單擊“確定”按鈕，完成單元格的拆分。結(jié)果如圖12-17所示。圖12-16“拆分單元格”對(duì)話框

圖12-17完成單元格的拆分六、單元格的內(nèi)部對(duì)齊方式選擇單元格（可以選擇多個(gè)單元格），如圖12-18所示，單擊屬性面板中的“水平”欄或“垂直”欄右側(cè)的下拉按鈕，在彈出的菜單中選擇一種水平或垂直對(duì)齊方式。圖12-18設(shè)置單元格的內(nèi)部對(duì)齊方式12.3表格的高級(jí)編輯一、設(shè)置表格樣式二、導(dǎo)入與導(dǎo)出表格數(shù)據(jù)三、對(duì)表格數(shù)據(jù)排序四、向表格內(nèi)部添加表格一、設(shè)置表格樣式（1）選擇目標(biāo)表格。（2）如圖12-19所示，執(zhí)行“修改/編輯標(biāo)簽”命令，打開(kāi)“標(biāo)簽編輯器”對(duì)話框。圖12-19執(zhí)行“修改/編輯標(biāo)簽”命令一、設(shè)置表格樣式（3）如圖12-20所示為“標(biāo)簽編輯器”對(duì)話框，可在“常規(guī)”選項(xiàng)中設(shè)置表格基本外觀樣式，這也是在屬性面板中顯示的常用屬性。圖12-20“標(biāo)簽編輯器”對(duì)話框一、設(shè)置表格樣式（4）如圖12-21所示，單擊“瀏覽器特定的”選項(xiàng)，在該項(xiàng)中可以設(shè)置邊框顏色變化。設(shè)置完成后單擊“確定”按鈕。圖12-21設(shè)置邊框顏色變化二、導(dǎo)入與導(dǎo)出表格數(shù)據(jù)1．導(dǎo)入表格數(shù)據(jù)圖12-22“導(dǎo)入Excel文檔”窗口二、導(dǎo)入與導(dǎo)出表格數(shù)據(jù)1．導(dǎo)入表格數(shù)據(jù)圖12-23“另存為”對(duì)話框二、導(dǎo)入與導(dǎo)出表格數(shù)據(jù)1．導(dǎo)入表格數(shù)據(jù)圖12-24“導(dǎo)入表格式數(shù)據(jù)”對(duì)話框二、導(dǎo)入與導(dǎo)出表格數(shù)據(jù)2．導(dǎo)出表格數(shù)據(jù)（1）新建表格，并輸入數(shù)據(jù)。（2）執(zhí)行“文件/導(dǎo)出/表格”命令，打開(kāi)如圖12-25所示的“導(dǎo)出表格”對(duì)話框。圖12-25“導(dǎo)出表格”對(duì)話框二、導(dǎo)入與導(dǎo)出表格數(shù)據(jù)2．導(dǎo)出表格數(shù)據(jù)（3）選擇分隔表格數(shù)據(jù)的分隔符及換行符。（4）單擊“導(dǎo)出”按鈕，打開(kāi)圖12-26所示的“表格導(dǎo)出為”窗口，選擇保存地址，輸入文件名，單擊“保存”按鈕。圖12-26“表格導(dǎo)出為”窗口三、對(duì)表格數(shù)據(jù)排序?qū)Ρ砀駭?shù)據(jù)進(jìn)行排序的方法如下：（1）新建表