表格由
标签来定义,每个表格均有若干行(由标签定义),每行被分割为若干单元格(由
标签定义)。字母 td 指表格数据(table data),即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。 |
1 HTML 表格的基本结构:2 <table>…table>:定义表格3 <th>…th>:定义表格的标题栏(文字加粗)4 <tr>…tr>:定义表格的行5 <td>…td>:定义表格的列
HTML 表格和边框属性,如果不定义边框属性,表格将不显示边框。有时这很有用,但是大多数时候,我们希望显示边框,使用边框属性border来显示一个带有边框的表格:
1 <table border="1">2 <tr>3 <td>Row 1, cell 1td>4 <td>Row 1, cell 2td>5 tr>6 table>
HTML 表格表头单元格:表格的表头单元格使用
标签进行定义;表格的表头单元格属性主要是一些公共属性,如:align、dir、width、height。 大多数浏览器会把表头显示为粗体居中的文本: |
---|
1 <table border="1"> 2 <tr> 3 <th>Header 1th> 4 <th>Header 2th> 5 tr> 6 <tr> 7 <td>row 1, cell 1td> 8 <td>row 1, cell 2td> 9 tr>10 <tr>11 <td>row 2, cell 1td>12 <td>row 2, cell 2td>13 tr>14 table>
表格标题
:在标签中我们可以使用
1 table border = "1">2 <caption>这是标题caption>3 <tr>4 <td>row 1, column 1td><td>row 1, columnn 2td>5 tr> 6 <tr>7 <td>row 2, column 1td><td>row 2, columnn 2td>8 tr>9 table>
HTML表格高度和宽度:在
标签中您可以使用width(宽)和height(高)属性设置表格宽度和高度。您可以按像素或可用屏幕区域的百分比来指定表格宽度或高度。
1 <table border = "1" width = "400" height = "150"> 2 <tr> 3 <td>Row 1, Column 1td> 4 <td>Row 1, Column 2td> 5 tr> 6 <tr> 7 <td>Row 2, Column 1td> 8 <td>Row 2, Column 2td> 9 tr>10 table>
HTML表格背景:您可以使用以下方法之一设置HTML表格的背景,HTML5中不推荐使用bgcolor,background和bordercolor属性,不要使用这些属性:
1 <body> 2 <table border = "1" bordercolor = "green" bgcolor = "yellow"> 3 <tr> 4 <th>Column 1th> 5 <th>Column 2th> 6 <th>Column 3th> 7 tr> 8 table> 9 使用background属性需要提供图像 URL 地址-->10 <table border = "1" bordercolor = "green" background = "/images/test.png">11 <tr>12 <th>Column 1th>13 <th>Column 2th>14 <th>Column 3th>15 tr>16 table>17 body>
HTML表格空间:cellspacing属性-定义表格单元格之间的空间 ,cellpadding属性-表示单元格边框与单元格内容之间的距离
1 <table border = "1" cellpadding = "5" cellspacing = "5"> 2 <tr> 3 <th>Nameth> 4 <th>Salaryth> 5 tr> 6 <tr> 7 <td>其琛td> 8 <td>5000td> 9 tr>10 <tr>11 <td>曼迪td>12 <td>7000td>13 tr>14 table>
HTML合并单元格:如果要将两个或多个列合并为一个列,将使用colspan属性;如果要合并两行或更多行,则将使用rowspan属性。
1 <table border = "1"> 2 <tr> 3 <th>Column 1th> 4 <th>Column 2th> 5 <th>Column 3th> 6 tr> 7 <tr> 8 <td rowspan = "2">Row 1 Cell 1td> 9 <td>Row 1 Cell 2td>10 <td>Row 1 Cell 3td>11 tr>12 <tr>13 <td>Row 2 Cell 2td>14 <td>Row 2 Cell 3td>15 tr>16 <tr>17 <td colspan = "3">Row 3 Cell 1td>18 tr>19 table>
HTML表格头部、主体、页脚:表格可以分为三个部分 - 头部,主体和页脚,如同word文档中页面的页眉、正文、页脚。每个页面保持相同,而正文是表格的主要内容持有者。头部,主体和页脚的对应的三个标签是:
表可以包含多个
元素以指示不同的页面,但值得注意的是和标签应出现在之前
1 <table border = "1" width = "100%"> 2 <thead> 3 <tr> 4 <td colspan = "4">This is the head of the tabletd> 5 tr> 6 thead> 7 8 <tfoot> 9 <tr>10 <td colspan = "4">This is the foot of the tabletd>11 tr>12 tfoot>13 14 <tbody>15 <tr>16 <td>Cell 1td>17 <td>Cell 2td>18 <td>Cell 3td>19 <td>Cell 4td>20 tr>21 tbody> 22 table>
HTML表格的嵌套,您可以在另一个表中使用一个表。可以使用
内的几乎所有标签。
Copyright © 2004-2024 Ynicp.com 版权所有 法律顾问:建纬(昆明)律师事务所 昆明市网翼通科技有限公司 滇ICP备08002592号-4