Error message here!

Hide Error message here!

忘记密码?

Error message here!

请输入正确邮箱

Hide Error message here!

密码丢失?请输入您的电子邮件地址。您将收到一个重设密码链接。

Error message here!

返回登录

Close

HTML中的table标签制作表格

情自阑珊(lipeng) 2019-11-08 20:24:00 阅读数:45 评论数:0 点赞数:0 收藏数:0

HTML中有一个重要的标签table,常用于构建表格,如果你要用HTML做一张课表,那么它的table标签就可以大显身手了。下面分享出一份某小学生课表的完整HTML代码,不足的地方欢迎指正!

 
 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>html中表格</title>
</head>
<body>
<table border="1" width="800" align="center" cellpadding="10" cellspacing="0">
<!-- 标题-->
<caption><h2>某小学一年级(三班)课程表</h2></caption>
<!-- 表头-->
<thead>
<tr bgcolor="#90ee90">
<th>星期</th>
<th>星期一</th>
<th>星期二</th>
<th>星期三</th>
<th>星期四</th>
<th>星期五</th>
</tr>
</thead>
<!-- 主体-->
<tbody align="center">
<tr>
<td rowspan="3" bgcolor="#f5deb3">上午<br>8:00 - 11:30</td>
<td>语文</td>
<td>数学</td>
<td>美术</td>
<td>体育</td>
<td>音乐</td>
</tr>
<tr>
<td>语文</td>
<td>数学</td>
<td>美术</td>
<td>体育</td>
<td>音乐</td>
</tr>
<tr>
<td>语文</td>
<td>数学</td>
<td>美术</td>
<td>体育</td>
<td>音乐</td>
</tr>
<tr>
<td rowspan="2" bgcolor="#e0ffff">下午<br>13:30 - 15:30</td>
<td>语文</td>
<td>数学</td>
<td>美术</td>
<td>体育</td>
<td>音乐</td>
</tr>
<tr>
<td>语文</td>
<td>数学</td>
<td>美术</td>
<td>体育</td>
<td>音乐</td>
</tr>
</tbody>
<tfoot align="center">
<tr bgcolor="#d3d3d3">
<td>备注:</td>
<td colspan="5">周未家长应该多些时间陪同孩子学习</td>
</tr>
</tfoot>
</table>
</body>
</html>

代码运行结果如下图所示:

 

版权声明
本文为[情自阑珊(lipeng)]所创,转载请带上原文链接,感谢
https://www.cnblogs.com/wanna-lipeng/p/11823071.html