1、第第4 4章章 表格的應(yīng)用表格的應(yīng)用第第4 4章章 表格的應(yīng)用表格的應(yīng)用n4.1 4.1 表格的創(chuàng)建表格的創(chuàng)建n4.2 4.2 表格的格式化表格的格式化n4.3 4.3 導(dǎo)入和導(dǎo)出表格式數(shù)據(jù)導(dǎo)入和導(dǎo)出表格式數(shù)據(jù)n4.4 4.4 對(duì)表格進(jìn)行排序?qū)Ρ砀襁M(jìn)行排序n4.5 4.5 實(shí)例制作實(shí)例制作4.14.1表格的創(chuàng)建表格的創(chuàng)建n4.1.14.1.1插入表格插入表格n4.1.2.4.1.2.創(chuàng)建嵌套表格創(chuàng)建嵌套表格4.1.14.1.1插入表格插入表格1.在文檔窗口中，將光標(biāo)放在需要?jiǎng)?chuàng)建表格的位置，在“插入”欄的“常用”類別中，單擊“表格”按鈕，或選擇“插入”菜單下的“表格”選項(xiàng)，彈出 “表格”對(duì)話框。

2、2.對(duì)“表格”對(duì)話框中的各個(gè)參數(shù)進(jìn)行設(shè)置n行數(shù)：確定表格具有的行的數(shù)目。n列數(shù)：確定表格具有的列的數(shù)目。n表格寬度：以像素為單位或按占瀏覽器窗口寬度的百分比指定表格的寬度。n邊框粗細(xì)：指定表格邊框的寬度。如果您沒(méi)有明確指定邊框粗細(xì)的值，則大多數(shù)瀏覽器按邊框粗細(xì)設(shè)置為 1 顯示表格。若要確保瀏覽器顯示的表格沒(méi)有無(wú)邊框，請(qǐng)將邊框粗細(xì)設(shè)置為 0。n單元格邊距：確定單元格邊框和單元格內(nèi)容之間的像素?cái)?shù)。n單元格間距：確定相鄰的表格單元格之間的像素?cái)?shù)。 4.1.2.4.1.2.創(chuàng)建嵌套表格創(chuàng)建嵌套表格表格之中還有表格就叫做嵌套表格。引入嵌套表格，由總表格負(fù)責(zé)整體排版，由嵌套的表格負(fù)責(zé)各個(gè)子欄目的排版，并插

3、入到總表格的相應(yīng)位置中，各司其職，互不沖突。另外，通過(guò)嵌套表格，利用表格的背景圖像、邊框、單元格間距和單元格邊距等屬性可以得到漂亮的邊框效果，制作出精美的網(wǎng)頁(yè)。制作嵌套表格的步驟如下：（1）單擊一個(gè)表格中的單元格，定位插入的光標(biāo)。（2）選擇“插入”菜單中的“表格”選項(xiàng)，打開(kāi)“表格”對(duì)話框。（3）在“表格”對(duì)話中，為嵌套表格指定所需要的屬性，然后單擊“確定”按鈕，完成操作。在表格中可以直接輸入文字或插入圖像，也可以進(jìn)行文字粘貼。4.24.2表格的格式化表格的格式化n4.2.14.2.1選擇單元格對(duì)象選擇單元格對(duì)象n4.2.2 4.2.2 表格的表格的HTMLHTML代碼代碼n4.2.34.2.3

4、設(shè)置表格屬性設(shè)置表格屬性n4.2.44.2.4設(shè)置單元格、行和列屬性設(shè)置單元格、行和列屬性n4.2.54.2.5套用套用“表格模板表格模板”n4.2.64.2.6去除表格輔助線去除表格輔助線4.2.14.2.1選擇單元格對(duì)象選擇單元格對(duì)象1.選中整個(gè)表格要選中整個(gè)表格，有如下幾種方法：（1）選擇整個(gè)表格的方法是把鼠標(biāo)放在表格邊框的任意處，當(dāng)鼠標(biāo)指針右下角出現(xiàn)標(biāo)志時(shí)，單擊鼠標(biāo)左鍵即可選中整個(gè)表格。（2）在表格內(nèi)任意處單擊，然后在狀態(tài)欄的標(biāo)簽選擇器中單擊標(biāo)記，即可選中整個(gè)表格。（3）在單元格任意處單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇“表格”選項(xiàng)中的“選擇表格”命令或者按Ctrl+A組合鍵，即可選中

5、整個(gè)表格。2.選中表格行要選中表格行，有如下三種方法：（1）將鼠標(biāo)指針移動(dòng)到表格行左方表格之外的位置，當(dāng)鼠標(biāo)指針變?yōu)橐粋€(gè)指向右方的黑色箭頭形狀時(shí)，單擊鼠標(biāo)左鍵即可選中相應(yīng)的表格行。在此基礎(chǔ)上，按住鼠標(biāo)左鍵，上下拖動(dòng)鼠標(biāo)，即可選中多行。（2）先單擊要選中表格行的第一個(gè)單元格，然后按住鼠標(biāo)左鍵拖動(dòng)鼠標(biāo)，直到表格行的最后一個(gè)單元格中，再釋放鼠標(biāo)，即可選中表格行，如圖4-4所示。在此基礎(chǔ)上，若繼續(xù)按住鼠標(biāo)左鍵上下拖動(dòng)鼠標(biāo)，即可選中多個(gè)表格行。（3）先單擊要選中表格行的任意一個(gè)單元格，然后在狀態(tài)欄的標(biāo)記選擇器中單擊標(biāo)記，即可選中該表格行。3.選中表格列選中表格列的方法與選中表格行的方法類似，這里不再贅述

6、。4.選中單元格（1）在要選擇的單元格中按下鼠標(biāo)左鍵，并拖拽鼠標(biāo)到相鄰單元格中，當(dāng)單元格四周帶有黑色粗框時(shí)釋放鼠標(biāo)，即可選中該單元格。（2）要選中某一單元格，按住Ctrl鍵，用鼠標(biāo)在需要選中的單元格單擊即可。（3）在要選中的單元格單擊鼠標(biāo)左鍵，然后在狀態(tài)欄的標(biāo)記選擇器中單擊標(biāo)記，即可選中該單元格。4.2.2 4.2.2 表格的表格的HTMLHTML代碼代碼插入表格后，切換到代碼模式或拆分模式，都可以看到一個(gè)表格的代碼表示。任何表格都有三個(gè)基本要素：表行、表頭和表項(xiàng)，每個(gè)要素都有自己的標(biāo)簽。其基本定義格式如下： 定義表格； 定義表行 定義表頭 定義表項(xiàng)（單元格）1. 表格尺寸設(shè)置一個(gè)表由開(kāi)始，結(jié)

7、束，表格的標(biāo)題和內(nèi)容全都包含在這兩個(gè)標(biāo)記之間。表格的整體外觀由標(biāo)記的屬性決定。主要有以下幾項(xiàng)表格屬性：（1）表的大小用width=“數(shù)值”和height=“數(shù)值”屬性說(shuō)明。前者為表寬，后者為表高，數(shù)值是為像素?cái)?shù)或占窗口的百分比。（2）定義表格的粗細(xì)由border=“n”說(shuō)明，n取整數(shù)，單位是像素（如果省略，則不帶邊框）。將border設(shè)成不同的值，可產(chǎn)生不同的效果。 （3）表格間距用cellspacing=數(shù)值表示，數(shù)值的單位是像素。 2.表格內(nèi)文字的布局與對(duì)齊表格中數(shù)據(jù)的排列方式有兩種，分別是左右排列和上下排列。左右排列以align屬性來(lái)設(shè)置，而上下排列則由valign屬性來(lái)設(shè)置。其中左右排

8、列的位置可以分為三種：居左（left）、居中（center）和居右（right）。上下排列常用的有四種：上對(duì)齊（top）、居中（middle）、下對(duì)齊（bottom）和基線（baseline）。 3.表格的顏色在表格中，既可以對(duì)整個(gè)表格設(shè)置底色，也可以對(duì)任何一行、一個(gè)單元格使用背景色。主要有以下三種：（1）表格的背景顏色：（2）行的背景顏色：（3）單元格的背景顏色：或注：值為顏色的名稱。4.2.34.2.3設(shè)置表格屬性設(shè)置表格屬性在編輯窗口中，單擊表格的左上角或在邊框線上的任意位置雙擊，即可選中表格，在屬性面板中可進(jìn)一步設(shè)置表格 4.2.44.2.4設(shè)置單元格、行和列屬性設(shè)置單元格、行和列屬性

9、表格由很多單元格組成，每個(gè)單元格可以設(shè)置不同的屬性。也可以同時(shí)選中多個(gè)單元格，設(shè)置其共同的屬性。 4.2.54.2.5套用套用“表格模板表格模板”n在要格式化的表格中單擊，再使用“命令”菜單中的“格式化表格”命令，打開(kāi)“格式化表格”對(duì)話框，在該對(duì)話框中選擇一種樣式，最后按“確定”按鈕 4.2.64.2.6去除表格輔助線去除表格輔助線n方法一：選中表格，單擊寬度輔助線上的數(shù)字和小三角形，從下拉菜單中選擇“隱藏表格寬度”，這樣，表格的寬度輔助線就被去掉了。n方法三：選擇“查看”菜單中的“可視化助理”選項(xiàng)，在打開(kāi)的級(jí)聯(lián)菜單中單擊“表格寬度”選項(xiàng)同。這樣也可以刪除表格的寬度輔助線。n方法二：選擇工具欄

10、上的“視圖選項(xiàng)”圖標(biāo)，從下拉菜單中選擇“表格寬度”，這樣表格寬度的輔助線沒(méi)有了。4.34.3導(dǎo)入和導(dǎo)出表格式數(shù)據(jù)導(dǎo)入和導(dǎo)出表格式數(shù)據(jù)1.導(dǎo)入表格數(shù)據(jù)(1)選擇“文件”菜單下的“導(dǎo)入”選項(xiàng)，在其子菜單中單擊“表格式數(shù)據(jù)”命令，或選擇“插入”菜單下的“表格對(duì)象”選項(xiàng)，在其子菜單中單擊“導(dǎo)入表格式數(shù)據(jù)”。打開(kāi)“導(dǎo)入表格式數(shù)據(jù)”對(duì)話框(2）在該對(duì)話框中，此對(duì)話框允許您指定有關(guān)表格式數(shù)據(jù)文件的信息，并指定要使用這些數(shù)據(jù)創(chuàng)建的表格的屬性。若要完成“導(dǎo)入表格式數(shù)據(jù)”對(duì)話框，請(qǐng)執(zhí)行以下操作：數(shù)據(jù)文件：是要導(dǎo)入的文件的名稱。單擊“瀏覽”按鈕選擇一個(gè)文件，數(shù)據(jù)文件可以是純文本格式，也可以是Excel等軟件創(chuàng)建的文

11、件，定界符：是正在導(dǎo)入的文件中所使用的分隔符，其中有逗號(hào)，分號(hào)，Tab，引號(hào)，其它等幾個(gè)選項(xiàng)。設(shè)置完畢后，單擊“確定”按鈕，系統(tǒng)完成導(dǎo)入表格數(shù)據(jù)操作。 2.2.導(dǎo)出表格導(dǎo)出表格（1）請(qǐng)將插入點(diǎn)放置在表格中的任意單元格中，選擇“文件”菜單中“導(dǎo)出”選項(xiàng)，在子菜單中單擊“表格”命令。即會(huì)出現(xiàn)“導(dǎo)出表格”對(duì)話框。（2）在“導(dǎo)出表格”對(duì)話框中，指定導(dǎo)出表格的選項(xiàng)。此對(duì)話框允許您設(shè)置分隔符和換行符樣式以通過(guò)從表格中導(dǎo)出數(shù)據(jù)來(lái)創(chuàng)建文本文件。定界符：指定應(yīng)該使用哪個(gè)分隔符字符在導(dǎo)出的文件中隔開(kāi)各項(xiàng)。換行符：指定您將在哪個(gè)操作系統(tǒng)中打開(kāi)導(dǎo)出的文件：Windows、Macintosh 還是 UNIX。（不同的操

12、作系統(tǒng)具有不同的指示文本行結(jié)尾的方式。）設(shè)置后單擊“導(dǎo)出”按鈕，即會(huì)出現(xiàn)“表格導(dǎo)出為”對(duì)話框，（3）在該對(duì)話框中輸入文件名稱，單擊“保存”，完成導(dǎo)出表格的操作。4.44.4對(duì)表格進(jìn)行排序?qū)Ρ砀襁M(jìn)行排序1.選擇該表格或單擊任意單元格。選擇“命令”菜單中的“排序表格”命令。即會(huì)出現(xiàn)“排序表格”對(duì)話框2.該對(duì)話框允許您指定表格的排序方式，若要完成“排序表格”對(duì)話框，請(qǐng)執(zhí)行以下操作：排序按：可以確定哪個(gè)列的值將用于對(duì)表格的行進(jìn)行排序。順序：確定是按字母還是按數(shù)字順序以及是以升序（A 到 Z，小數(shù)字到大數(shù)字）還是降序?qū)α羞M(jìn)行排序。再按/順序：確定在不同列上第二種排序方法的排序順序。在“再按”彈出式菜單中

13、指定應(yīng)用第二種排序方法的列，并在“順序”彈出式菜單中指定第二種排序方法的排序順序。排序包含第一行：指定表格的第一行應(yīng)該包括在排序中。如果第一行是不應(yīng)移動(dòng)的標(biāo)題，則不選擇此選項(xiàng)。對(duì)標(biāo)題行：進(jìn)行排序指定使用與 body 行相同的條件對(duì)表格 thead 部分（如果存在）中的所有行進(jìn)行排序。對(duì)腳注行進(jìn)行：排序指定使用與 body 行相同的條件對(duì)表格 tfoot 部分（如果存在）中的所有行進(jìn)行排序。設(shè)置完成后，單擊“應(yīng)用”或“確定”按鈕，完成操作。4.5 4.5 實(shí)例制作實(shí)例制作n4.5.14.5.1虛線表格虛線表格n4.5.24.5.2幾種特殊表格的制作幾種特殊表格的制作n4.5.34.5.3圓角表格圓角表格n4.5.44.5.4運(yùn)用表格排版制作頁(yè)面運(yùn)用表格排版制作頁(yè)面 4.5.14.5.1虛線表格虛線表格n在瀏覽Internet時(shí)，會(huì)發(fā)現(xiàn)很多網(wǎng)站排版所用的表格都是經(jīng)過(guò)各種美工制作的，非常漂亮，不僅起到了網(wǎng)頁(yè)排版的作用，而且在很大程度上美化了網(wǎng)頁(yè)，使網(wǎng)頁(yè)看起來(lái)非常清爽、簡(jiǎn)潔。虛線表格就是其中一種。4.5.24.5.2幾種特殊表格的制作幾種特殊表格的制作n表格在網(wǎng)頁(yè)設(shè)計(jì)中可以