table为表格标签
tr为行,td为列,th为每一个数据的表头。
注意:将th写在与tr平级效果如上图,为每一列的表头。将th写在与td平级效果如下图,为每一行表头。
一个小技巧:
table[border=$].item$#item$*3>tr*3>td*4>{$$}
创建的是border从1到3,class从1到3,id从1到3,3行4列,数据为两位数字的3个表格。
效果图:
<td></td>与<td> </td>的不同 前者不显示内边距,后者显示内边距。在有的浏览器上两者效果一样。
1、caption 属性标签为表格添加标题
2、rowspan跨行,colspan跨列标签 一般和th表头标签合用。colspan使用代码如下:
<table border="1"> <caption>我的标题</caption> <tr> <th>head1</th> <th colspan="2">head2</th> </tr> <tr> <td>01</td> <td>02</td> <td>03</td> </tr> <tr> <td>11</td> <td>12</td> <td>13</td> </tr> <tr> <td>21</td> <td>22</td> <td>23</td> </tr> </table>
效果如下:
rowspan使用代码如下:
<table border="1"> <caption>我的标题</caption> <tr> <th>head1</th> <td>01</td> <td>02</td> <td>03</td> </tr> <tr> <th rowspan="2">head2</th> <td>11</td> <td>12</td> <td>13</td> </tr> <tr> <td>21</td> <td>22</td> <td>23</td> </tr> </table>
效果如下:
3、cellpadding设置表格单元格的内边距,在table中设置
4、cellspacing设置表格单元格之间的间距,在table中设置
5、表格背景,单元格背景,数据显示位置(align和valign配合使用,可以实现9种位置显示),字体大小都可以都可以设置。注意:在table表格中使用align只能实现左右位置,不能实现上下位置显示;valign可实现上下位置变化,不能实现左右,两者合用可实现四个角的位置。