【導(dǎo)讀】1. 1. 1. 1. 2. 2. 2. 2. 3. 3. 3. 3. 3. 3. 4. 4. 5. 5. 5. 6. 6. 6. 7. 8. 8. 8. 10. 11. 12. 13. 14. 15. 15. 16. 16. 16. 17. 18. 18. 19. 19. 21. 21. 21. 22. 23. 24. 24. 27. 27. 27. 27. 27. 29. 29. 30. 31. 31. 33. 33. 33. 33. （一）rowspan屬性?????

　　

【正文】 HTML使用 MENU和 LI標(biāo)簽來(lái)定義菜單列表。菜單列表標(biāo)簽 MENU是成對(duì)標(biāo)簽，首標(biāo)簽MENU和尾標(biāo)簽 /MENU之間的內(nèi)容就是菜單列表的內(nèi)容。菜單列表每一列表項(xiàng)開(kāi)頭也必須用項(xiàng)目標(biāo)簽 LI進(jìn)行標(biāo)識(shí)。一般來(lái)說(shuō)，菜單列表每項(xiàng)的長(zhǎng)度不超過(guò)一行。 菜單列表的顯示效果與無(wú)序列表基本相同，只不過(guò)在排列上更為緊湊，參見(jiàn)圖 31。 五、描述性列表 HTML使用 DL、 DT和 DD標(biāo)簽來(lái)定義描述性列表?！?DL”即 Definition List，是描述性列表標(biāo)簽。 DL標(biāo)簽是成對(duì)標(biāo)簽，首標(biāo)簽 DL和尾標(biāo)簽 /DL之間的內(nèi)容就是描述性列表的內(nèi)容，由一系列用描述項(xiàng)標(biāo)簽 DT或解釋項(xiàng)標(biāo)簽 DD標(biāo)識(shí)的列表項(xiàng)組成。 DT和 DD標(biāo)簽都是單獨(dú)標(biāo)簽，位于列表項(xiàng)的開(kāi)頭，分別表示該項(xiàng)是描述項(xiàng)和解釋項(xiàng)。和 LI標(biāo)簽一樣， DTHTML 標(biāo)準(zhǔn)教程 北京珍連人文科技開(kāi)發(fā)有限公司 24 24 和 DD標(biāo)簽也隱含有 BR標(biāo)簽的作用， Web瀏覽器在顯示時(shí)會(huì)自動(dòng)換行。 DT和 DD標(biāo)簽通常是成對(duì)出現(xiàn)的，即一個(gè)描述項(xiàng)對(duì)應(yīng)于一個(gè)解釋項(xiàng)。一個(gè)描述項(xiàng)也可以對(duì)應(yīng)于幾個(gè)解釋項(xiàng)，但 最好不要出現(xiàn)幾個(gè)描述項(xiàng)對(duì)應(yīng)于同一個(gè)解釋項(xiàng)的情況。 在顯示時(shí)，解釋項(xiàng)的內(nèi)容會(huì)自動(dòng)縮進(jìn)一定的距離，使列表的結(jié)構(gòu)更加清晰。例如： html head title描述性列表范例程序 /title /head body HR這是一個(gè)描述性列表： P DL DT日用雜品 DD例如熱水瓶、臉盆等等 DT食品種類(lèi) DD魚(yú)、肉和雞 DD青菜、蘿卜和豆腐 DD桔 子、蘋(píng)果和梨 /DL HR /body /html 在 34所示。 圖 34 描述性列表顯示效果圖 HTML中的列表是可以嵌套的，也就是說(shuō)，一個(gè)列表的列表項(xiàng)可以是另一個(gè)相同或不同類(lèi)型的列表。例如： html head title列表嵌套的范例程序 /title /head body PHR OL HTML 標(biāo)準(zhǔn)教程 北京珍連人文科技開(kāi)發(fā)有限公司 25 25 LI一些常見(jiàn)的水果： UL LI蘋(píng)果和桔子 LI香蕉和草萄 LI西瓜和桃子 /UL HR LI這是列表的第二項(xiàng) HR LI一些常見(jiàn)的肉類(lèi) UL LI豬肉和牛肉 LI羊肉和兔肉 /UL /OL HR /body /html 在 35所示。 圖 35 嵌套列表顯示效果圖 第 2課 HTML中的表格元素 表格是 HTML文檔中一個(gè)很重要的元素。在這一課中，我們將介紹一下在表格中使用 的一些主要標(biāo)簽。 一、 table標(biāo)簽 table標(biāo)簽是表格的標(biāo)識(shí)符，用以界定表格的范圍。 table標(biāo)簽是成對(duì)出現(xiàn)標(biāo)簽，首標(biāo)簽 table和尾標(biāo)簽 /table之間的內(nèi)容就是表格的內(nèi)容。 table標(biāo)簽的屬性主要有border、 width、 height、 align、 cellapacing和 cellpadding，它們都是可選的。 （一） border屬性 HTML 標(biāo)準(zhǔn)教程 北京珍連人文科技開(kāi)發(fā)有限公司 26 26 border屬性的參數(shù)值是數(shù)字，表示表格邊框?qū)挾人嫉南袼攸c(diǎn)數(shù)； border屬性也可以不帶參數(shù)值使用，僅表示該表格是有邊框的。例如， table border=10表示該表格的邊框?qū)挾葹?10個(gè)像素點(diǎn)。 （二） width和 height屬性 width和 height屬性的作用是指定表格的大小。其中 width屬性用以規(guī)定表格的寬度，height屬性用以規(guī)定表格的高度。這兩個(gè)屬性的參數(shù)值可以是數(shù)字或百分?jǐn)?shù)，其中數(shù)字表示表格寬度 （高度）所占的像素點(diǎn)數(shù)，百分?jǐn)?shù)表示表格的寬度（高度）占瀏覽器窗口寬度（高度）的百分比。例： table width=200 height=50％ 表示該表格的寬度為 200個(gè)像素點(diǎn)，高度為瀏覽器窗口高度的 50％。 （三） align屬性 align屬性的參數(shù)值為 left、 center和 right之一，分別表示表格位于其相鄰文字的左側(cè)、表格水平居中和表格位于與其相鄰的文字右側(cè)。例如： html head titleAn example of table/title /head body tabl border=3 Width=60％ align=left TR THNumber/THName/TH THDepartment/THTHCourse/THTHScore/TH /TR TR TD1/TDTDJohn /TD TDComputer/TDTDProgramming/TDTD87/TD /TR TR TD2/TDTDBetty/TDManagement/TD TDMarketing/TD85/TD /TR /table This is an example of ALIGN=leftBR Please pay attention to the relative positionBR HR table border=5 width=50％ align=center TR THNumber/THTHName/TH THDepartment/THTHCourse/TH THScore/TH HTML 標(biāo)準(zhǔn)教程 北京珍連人文科技開(kāi)發(fā)有限公司 27 27 /TR TR TD1/TDTDJohn /TD TDComputer/TDTDProgramming/TDTD87/TD /TR TR TD2TDBetty/TDBetty/TDTDManagement/TD TDMarketing/TDTD85/TD /TR /table This is an example of ALIGN=centerBR Please pay attention to the relative positionBR HR tabl border=2 Width=50％ align=right TR TH Number/THTHName/TH THDepartment/THTHCourse/TH THScore/TH /TR TR TD1/TDuTDJohn/TD TDComputer/TDTDProgramming/TDTD87/TD /TR TR TD2 /TDTDBetty/TDTDManagement/TD TDMarkting/TDTD85/TD /TR /table This is an example of ALIGN=rishtBR Please pay attention to the relative positionBR /body /html 在 36所示。 HTML 標(biāo)準(zhǔn)教程 北京珍連人文科技開(kāi)發(fā)有限公司 28 28 圖 36 表格顯示效果圖 （四） cellspacing屬性 cellspacing 屬性用以指定表格各單元格之間的空隙。該屬性的參數(shù)值為數(shù)字，表示單元格間隙所占的像素點(diǎn)數(shù)。 （五） cellpadding屬性 cellpadding 屬性用于指定單元格內(nèi)容與單元格邊界之間空白距離的大小、該屬性的參數(shù)值也是數(shù)字，表示單元格內(nèi)容與上下邊界之間空白距離的高度所占的像素點(diǎn)數(shù)以及單元格內(nèi)容與左右邊界之間空白距離的寬度所占的像素點(diǎn)數(shù)。例如 ： html head titleAn example of table/title body HR 未加入單元格屬性規(guī)定前： BR table border=3 TR TH Number/THTH Name /TH THDepartment/THTHCourse/THTHScorse/TH /TR TR TD1/TDTDJohn/TD TDComputer/TDTDProgramming/TDTD87/TD/TR TR TD2 /TDTDBetty/TDTDManagement/TD TDMarketing/TDTD85/TD /TR /tale HR 加入單元格屬性規(guī)定后： BR tableborder=3 cellspacing=10 cellpadding=10 TR Th Number/THTH Name /TH THDepartment/THTHCourse/THTHScors/TH /TR TR TD1/TDTDJohn/TD TDComputer/TDTDProgrammingTD87/TD /TR TR HTML 標(biāo)準(zhǔn)教程 北京珍連人文科技開(kāi)發(fā)有限公司 29 29 TD2/TDTDBetty/TDTDManagement/TD TDMarketing /TDTD85/TD /TR /table /body /html 在 37所示。 和普通表格一樣， HTML中的表格也是由表格標(biāo)題、表頭元素和具體數(shù)據(jù)元素組成的。 HTML是通過(guò)在表格標(biāo)簽中嵌套使用有關(guān)標(biāo)簽來(lái)定義這些元素的。嵌套在表格標(biāo)簽中使用的標(biāo)簽主要有 CAPTION、 TR、 TH和 TD。 二、 CAPTION標(biāo)簽 表格標(biāo)題標(biāo)簽 CAPTION是成對(duì)出現(xiàn)標(biāo)簽，首標(biāo)簽 CAPTION和尾標(biāo)簽 /CAPTION之間的內(nèi)容就是表格的標(biāo)題。 CAPTION有兩個(gè)屬性： ALION和 VALIGN，它們都是可選的。 圖 37 表格顯示效果圖 （一） ALIGN屬性 ALGN 屬性的參數(shù)值為 left、 center 和 right 之一，分別表示表格標(biāo)題與表格的左沿對(duì)齊、位于表格中間和與表格的右沿對(duì)齊。缺省時(shí)，表格標(biāo)題位于表格中間。 （二） VALIGN屬性 VALIGN屬性的參數(shù)值 為 top和 bottom之一，分別表示表格標(biāo)題位于表格的上方和下方。缺省時(shí)，表格標(biāo)題位于表格的上方。例如： html head title表格標(biāo)題標(biāo)題測(cè)試文檔 /title body HR tabe border=3 CAPTION ALIGN=rightB Students’ Score/B/CAPTIONBR TR HTML 標(biāo)準(zhǔn)教程 北京珍連人文科技開(kāi)發(fā)有限公司 30 30 THNumber/TH/THTHName/TH ThDepartment/THTHCourseTHScore/TH /TR TR TD1/TDTDJohnTD TDComputer/TDTDProgramming/TDTD87/TD/TR TR TD2/TDTDBetty/TDTDManagement/TD TDMarketing/TD85/TD /TR /table