利用HTML做一个课程表

最新推荐文章于 2023-11-06 23:29:44 发布

拂柳小清风

最新推荐文章于 2023-11-06 23:29:44 发布

阅读量5.9k

点赞数 4

本文链接：https://blog.csdn.net/Great_Wow/article/details/105165268

版权

这篇博客介绍了如何使用HTML来制作一个14行8列的课程表，包括设置单元格合并和添加文字、背景颜色的方法，适合初学者学习网页布局。

摘要由CSDN通过智能技术生成

示例:

步骤:

观察该表,建立一个14行*8列的表格
第一行合并成一个单元格
从第2行1列起,后面的每两行进行合并
添加相应的文字及背景颜色

代码片段:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>TimeTable</title>
	<style>
		/* 设置单独的字体 颜色  */
		.font{
			color:rgb(129,134,138);
		}
		/*设置表格 边框属性 宽度 颜色 字体 大小*/
		table{
			border:1px solid #DEE4E4;
			width: 480px;
			color: white;
			font-family: "黑体";
			font-size:15px;
		}
	</style>
</head>
<body>
	<!-- 设置表格的 边距 文字居中 -->
	<table align="center" cellspacing="0">
		<tr height="82">
			<!-- 单元格合并 添加背景图片 -->
			<td colspan="8" background="Timetable.png"></td>
		</tr>
		<!-- 设置 单元格高度 背景颜色 文字居中 -->
		<tr height="30" bgcolor="#DBE0E3" align="center">
			<td width="30"> </td>
			<td class="font">周一</td>
			<td class="font">周二</td>
			<td class=