博客列表 >课程表案例

课程表案例

俞斌的博客
俞斌的博客原创
2019年03月13日 19:16:30597浏览

实例

<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<title>表格练习</title>
	<style type="text/css">
		*{
			margin: 0;padding: 0;
		}
		caption{
			margin: 30px;
		}
		table{
			margin: 0 auto;
			width: 600px;
			height: 300px;
			border: 2px solid #080808;
			border-collapse: collapse;
			background: #FF00FF;
			text-align: center;
		}
		th,td{
			border: 2px solid #080808;
		}
	</style>
</head>
<body>
	<table>
		<caption><h1>课程表</h1></caption>
		<tr>
			<th>项目</th><th colspan="5">课程</th><th colspan="2">休息日</th>
		</tr>
		<tr>
			<td>星期</td><td>星期一</td><td>星期二</td><td>星期三</td><td>星期四</td><td>星期五</td><td>星期六</td><td>星期日</td>
		</tr>
		<tr>
			<td rowspan="4">上午</td><td>语文</td><td>数学</td><td>英语</td><td>政治</td><td>历史</td><td>计算机</td><td rowspan="6">休息</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>语文</td><td>数学</td><td>英语</td><td>政治</td><td>历史</td><td>计算机</td>
		</tr>
		<tr>
			<td rowspan="2">下午</td><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>
	</table>
</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例


声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议