大家好，欢迎来到IT知识分享网。
一：表格包含的结构
table标签:定义表格
thead标签:表格的头部(可省略)
tbody标签:表格的内容(可省略)
tr标签:定义行
th标签:表头的单元格(文字加粗;文字居中)
td标签:表格的内容部分的普通单元格(浏览器默认的文字样式;文字左对齐)
<table> <thead> <tr> <th>序号</th> <th>班级</th> <th>姓名</th> <th>成绩</th> </tr> </thead> <tbody> <tr> <td>01</td> <td>一班</td> <td>小李</td> <td>90</td> </tr> <tr> <td>02</td> <td>一班</td> <td>小红</td> <td>95</td> </tr> <tr> <td>03</td> <td>二班</td> <td>小丽</td> <td>85</td> </tr> <tr> <td>04</td> <td>二班</td> <td>小张</td> <td>80</td> </tr> </tbody> </table>运行结果：
没有给table添加边框属性(border)不会显示表格的边框
table标签的属性：
border属性:边框
width属性:宽度
height属性:高度
align属性:表格的对齐方式
<table border="1px" width="50%" height="400px" align="center"> <thead> <tr> <th>序号</th> <th>班级</th> <th>姓名</th> <th>成绩</th> </tr> </thead> <tbody> <tr> <td>01</td> <td>一班</td> <td>小李</td> <td>90</td> </tr> <tr> <td>02</td> <td>一班</td> <td>小红</td> <td>95</td> </tr> <tr> <td>03</td> <td>二班</td> <td>小丽</td> <td>85</td> </tr> <tr> <td>04</td> <td>二班</td> <td>小张</td> <td>80</td> </tr> </tbody> </table>运行结果如下：
二，表格内单元格的合并
rowspan=”合并的单元格数量” 跨行合并
colspan=”合并的单元格数量” 跨列合并
cellspacing属性:设置表格外层边框和单元格边框之间的间距
<table border="1px" width="50%" cellspacing="0" height="400px" align="center"> <!-- caption表格标题 --> <caption>表格的标题</caption> <thead> <tr> <td>第一行</td> <td colspan="2">第一行</td> <td>第一行</td> </tr> </thead> <tbody> <tr> <td rowspan="2">第二行</td> <td>第二行</td> <td>第二行</td> <td>第二行</td> </tr> <tr> <td>第三行</td> <td>第三行</td> <td>第三行</td> </tr> <tr> <td>第四行</td> <td>第四行</td> <td>第四行</td> <td>第四行</td> </tr> </tbody> </table>运行结果为：
rowspan属性和colspan属性同时使用则行和列同时合并
<table border="1px" width="40%" height="400px" cellspacing="0"> <caption>标题</caption> <thead> <tr> <td>第一行</td> <td colspan="2">第一行</td> <td>第一行</td> </tr> </thead> <tbody> <tr> <td>第二行</td> <td colspan="2" rowspan="2">第二行</td> <td>第二行</td> </tr> <tr> <td>第三行</td> <td>第三行</td> </tr> <tr> <td>第四行</td> <td>第四行</td> <td>第四行</td> <td>第四行</td> </tr> </tbody> </table> 运行结果：
免责声明：本站所有文章内容,图片，视频等均是来源于用户投稿和互联网及文摘转载整编而成，不代表本站观点，不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益，请在线联系站长,一经查实,本站将立刻删除。 本文来自网络,若有侵权，请联系删除，如若转载，请注明出处：https://haidsoft.com/110350.html
