SQLsever_.pptVIP

T4 表格及排版 回顾 链接地址的表示 框架的使用 目标 表格及其属性 表格的行及其属性 表格的单元格及其属性 表格排版网页 　　在一个页面中经常会用到一些表格来显示数据，或定位网页中的元素。目前，相当多的网站利用无线表格来对主页中的众多内容进行分隔布局。 表格 2.5.1 表格的基本语法　　表格是由行和列交叉形成的单元格构成的，因此，要在页面上绘制一个表格，需要使用下面的标记组合。　　表格定义标记：TABLE……/TABLE　　表行定义标记：TR……/TR　　表头单元格定义标记：TH……/TH　　单元格定义标记：TD……/TD 　　表格必须用TABLE标记开始，用/TABLE标记结束。表格中的每一行由TR标记开始，由/TR标记结束。如果有一个5行的表格，则要用5对TR标记。每行中的每个单元格都由单元格标记TD或表头单元格标记TH定义。如果表格的一行中有6个单元格，就需要使用6对TD或TH。TH与TD的作用基本相同，只不过TH单元格中的文字居中加粗显示。　　注意：这种嵌套格式必须是完整的嵌套，绝对不能交叉。 　　[例] 表格设计示例，文件名CH2-12.html。　　HTMLHEADTITLE表格示例/TITLE/HEAD　　BODY　　TABLE　　 TRTH序号/TH TH产品名称/THTH生产厂/THTH单价/TH/TR　　 TRTD1/TDTD电视机/TDTDTCL/TDTD2800元/TD/TR　　 TRTD2/TDTD电冰箱/TDTD美的/TDTD3600元/TD/TR 　　/TABLE　　/BODY　　/HTML　　显示结果见图2.13。可以看出，该表格是一个无表线的表格。如果要设计成有表线的表格，就需要使用TABLE的属性。 　　 图2.13 不带属性的TABLE生成的表格 表格的属性　　表格标记是一个具有许多属性的标记，这些属性用来对表格的边框线、颜色等进行设置。表格的常用属性见表2.6。 　　 表2.6 表格的常用属性 如果我们将例2.12中不带属性的TABLE一句改为　　TABLE BORDER=1 BORDERCOLOR=Red CELLSPACING=2　　则显示结果如图2.14所示。 　　 图2.14 带属性的TABLE生成的表格 2.5.3 单元格的属性　　TR、TH、TD标记也是有属性的，它们的属性用来对单元格的宽度和高度、颜色、单元格中数据的对齐方式等进行设置。单元格的常用属性见表2.7。在这些属性中，ROWSPAN属性和COLSPAN属性也被称为合并单元格属性，其中ROWSPAN属性用于横向合并单元格，COLSPAN属性用于纵向合并单元格，使用这两个属性可以设计复杂的表格。 　　 表2.7 单元格的属性 2.5.4 表格标题设置　　标记格式：　　CAPTION ALIGN=对齐方式……/CAPTION　　其中，对齐方式可为top、bottom、left、center和right。默认对齐方式是在表格上方居中显示标题。此外，该标记必须放在TABLE标记中才有效。 2.5.5 复杂表格设计示例　　目前，表格被广泛地应用于网站的主页设计中，对主页上众多的内容按自己设置的格式来排列。用表格来进行页面布局的最大好处是表格可随浏览器分辨率自动调整表格的大小。为了使读者对复杂表格设计技巧有一个更深入的体会，下面我们给出两个相对较复杂的表格的HTML设计代码及其在浏览器中的显示效果。 　　[例] 复杂的跨行跨列表格设计示例，文件名CH2-13.html。　　HTML　　HEADTITLE复杂表格/TITLE/HEAD　　BODY　　TABLE Border=1 WIDTH=100% CAPTION跨行和跨列表格设计/CAPTION　　 TR　　 TD COLSPAN=3 ALIGN=center各类产品/TD 　　 /TR　　 TRTD ROWSPAN=2家用电气类/TD　　 TD电视机/TDTD洗衣机/TD　　 /TR　　 TRTD COLSPAN=2 ALIGN=center蒸汽喷雾电熨斗/TD 　　 /TR　　 TR　　 TD ROWSPAN=2学习用具类　　 /TD 　　 TD COLSPAN=2　　 计算机图书和光盘/TD　　 /TR　　 TRTD课本教材/TD　　 TD字典手册/TD　　 /TR　　/TABLE　　/BODY　　/HTML　　这个文件在浏览器中看到的显示效果如图2.15所示。 图2.15 跨行跨列表格 　　[例2.14] 在表格中嵌入图片示例，文件名CH2-14.html。　　HTML　　HEAD