用HTML制作一个课表

最新推荐文章于 2024-05-20 15:43:39 发布

G计算机1903付幸

最新推荐文章于 2024-05-20 15:43:39 发布

阅读量167

点赞数

文章标签： html 前端 java

本文链接：https://blog.csdn.net/2301_79706579/article/details/132841302

版权

表格基本代码：
<table>
    <tr>
        <td></td>
    </tr>
</table>
table表示表格
tr定义行
td定义单元格

表格相关属性（可以通过css设置）：
align="center" 表格居中
border="？" 边框粗细
cellpadding = "？" 单元格边和内容之间的距离
cellspacing="？"单元格之间的距离
width="？" height="？"表格的宽和高

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>我的课表</title>
		<style type="text/css">
			table{
			border-collapse: collapse;
			margin:0 auto;
			text-align: center;
			}
			td{
				border-radius: 4%;
			}
		</style>
	</head>
	<body>
<table border="0" height="700px" bgcolor="#fec7ff">
			<tr>
				<td> </td>
				<td>星期一</td>
				<td>星期二</td>
				<td>星期三</td>
				<td>星期四</td>
				<td>星期五</td>
			</tr>
			<tr class="greenTr">
				<td>第一二节</td>
				<td></td>
				<td bgcolor="#9f8bea">人工智能与应用<br>S1316</td>
				<td bgcolor="#e086aa">企业网站综合实训<br>S1520</td>
				<td bgcolor="#7acfa4">信息安全<br>S1520</td>
				<td> </td>
			</tr>
			<tr>
				<td>第三四节</td>
				<td bgcolor="#ffcd62">形式与政策<br>X2404</td>
				<td> </td>
				<td> </td>
				<td bgcolor="#73b3f0">前端框架技术<br>S1417</td>
				<td bgcolor="#ffcd62">计算机网络基础<br>X2408</td>
			</tr>
			<tr class="lvsetr">
				<td>第五六节</td>
				<td bgcolor="#7acfa4">业网站综合实训<br>S1419</td>
				<td> </td>
				<td> </td>
				<td bgcolor="#ffcd62">影视编辑与合成<br>S2410</td>
				<td> </td>
			</tr>
			<tr>
				<td>第七八节</td>
				<td> </td>
				<td> </td>
				<td> </td>
				<td> </td>
				<td bgcolor="#e086aa">影视编辑与合成<br>S2410</td>
			</tr>
		</table>
	</body>
</html>