您的位置：首页 > 其它

表格合并---课程表

2016-08-05 15:01 309 查看

<!DOCTYPE html>
<html lang="cn">
<head>
<meta charset="UTF-8">
<style type="text/css" >
td{
text-align:center;  /*每个单元格内内容水平居中*/
}
</style>
<title>表格合并</title>
</head>
<body>
<!--1、找到要合并的单元格
2、保留要合并的单元格中的第一个，删掉后面的
3、然后定义要保留下来的单元格所占的行数和列数
合并左右关系的单元格用colspan，上下关系单元格rowspan-->
border边框、align是表格
<table border="1" width="800" height="300" align="center">
<!--tr*5td*6可以快速创建5行6列的表格-->
<!--按住alt键鼠标选择一列，然后输入文字就会编辑多行（按住ALT键选中之后，按住后箭头→，即可开始编辑）-->
<!--第一行-->
<tr bgcolor="#6b8e23" >
<!--align水平剧中valign垂直居中-->
<!--b加粗-->
<td colspan="6"> <b>课程表</b> </td>
</tr>
<!--第二行-->
<tr >
<td width="80"></td>
<td>星期一</td>
<td>星期二</td>
<td>星期三</td>
<td>星期四</td>
<td>星期五</td>
</tr>
<!--第三行-->
<tr>
<td>第一节课</td>
<td>语文</td>
<td>数学</td>
<td>英语</td>
<td rowspan="2">语文</td>
<td rowspan="2">英语</td>
</tr>
<!--第四行-->
<tr>
<td>第二节课</td>
<td>化学</td>
<td>物理</td>
<td>数学</td>
</tr>
<!--第五行-->
<tr>
<td>第三节课</td>
<td>数学</td>
<td>化学</td>
<td>物理</td>
<td>英语</td>
<td>生物</td>
</tr>
<!--第六行-->
<tr>
<td>第四节课</td>
<td>英语</td>
<td>数学</td>
<td>化学</td>
<td>语文</td>
<td>物理</td>
</tr>
<!--第七行-->
<tr>
<td colspan="6" height="20"></td>
</tr>
<!--第八行-->
<tr>
<td>第五节课</td>
<td>英语</td>
<td>数学</td>
<td rowspan="2">物理</td>
<td rowspan="2">化学</td>
<td>语文</td>
</tr>
<tr>
<td>第六节课</td>
<td>语文</td>
<td>英语</td>
<td>数学</td>
</tr>
</table>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航