详细代码如下:
<!DOCTYPE html>
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>表格制作</title> </head> <body> <table bgcolor="black" width="500px"> <caption style="bold">学生信息</caption> <thead> <tr bgcolor="#a9a9a9" height="50px"> <th>姓名</th> <th>年龄</th> <th>学校</th> <th>考试成绩</th> <th>喜欢水果</th> <th>经常上的网站</th> </tr> </thead> <tbody> <tr bgcolor="white" align="center" height="30px"> <td align="left">张三</td> <td>22</td> <td>西安工业大学</td> <td>87</td> <td>桃子</td> <td> <a href="http://www.baidu.com/">百度 </a> <a href="http://www.sina.com/">新浪</a> </td> </tr> <tr bgcolor="white" align="center"> <td align="left">李四</td> <td>23</td> <td rowspan="2">上海交通大学</td> <td>85</td> <td>苹果</td> <td> <a href="https://www.taobao.com/">淘宝 </a> <a href="https://www.jd.com/">京东</a> </td> </tr> <tr bgcolor="white" align="center"> <td align="left">王刚</td> <td>45</td> <!-- <td>上海海洋大学</td> --> <td>86</td> <td>香蕉</td> <td> <a href="http://www.163.com/">网易</a> <a href="http://www.sina.com/">新浪</a> </td> </tr> </tbody> <tfoot> <tr bgcolor="white"> <td >总分</td> <td></td> <td></td> <td align="center">258</td> <td></td> <td></td> </tr> </tfoot> </table> </body></html>
注意事项:
1.宽度和高度属性 可以给table和td标签使用 2.水平对齐和垂直对齐 水平对齐可以给table和td使用 垂直对齐只能给tr和td标签使用 3.外边距和内边距属性 只能给table使用 4.表格分类 表格的标题 表格的表头信息 表格的主题信息 表格的叶尾信息 //必须写在table标签中,紧跟在table后面 5.单元格合并(添加td属性) colspan="x"水平合并X个单元格,同时删除多余的 rowspan="x"垂直合并X个单元格,同时删除多余的 单元格都是向后或者想下合并的
