html css 课程表

HTML和CSS课程表可以通过使用HTML表格和CSS样式来创建。在HTML中，可以使用`<table>`标签来创建表格，`<tr>`标签来创建行，`<th>`标签来创建表头，`<td>`标签来创建单元格。在CSS中，可以使用样式规则来定义表格的样式，如表格的宽度、高度、边框样式等。

下面是一个示例的HTML和CSS代码来创建一个课程表：

HTML代码：

<table>
  <thead>
    <tr>
      <th>时间</th>
      <th>星期一</th>
      <th>星期二</th>
      <th>星期三</th>
      <th>星期四</th>
      <th>星期五</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>8:10-11:50</td>
      <td rowspan="2">课程A</td>
      <td>课程B</td>
      <td>课程C</td>
      <td>课程D</td>
      <td>课程E</td>
    </tr>
    <tr>
      <td>14:00-17:40</td>
      <td>课程F</td>
      <td>课程G</td>
      <td>课程H</td>
      <td>课程I</td>
    </tr>
    <tr>
      <td>18:10-21:40</td>
      <td colspan="4">课程J</td>
    </tr>
  </tbody>
</table>

CSS代码：

table {
  width: 600px;
  height: 350px;
  border: 1px dashed rgb(252, 255, 252);
  border-collapse: collapse;
}

th {
  font-weight: bold;
  color: darkblue;
}

td {
  padding: 10px;
  border: 1px solid black;
}

这个课程表使用了一个表格，表头包含了星期一到星期五的标题，每一行表示一个时间段，每一列表示一个星期几。使用`rowspan`属性可以让一个单元格跨越多行，使用`colspan`属性可以让一个单元格跨越多列。通过CSS样式可以设置表格的宽度、高度、边框样式等。

请注意，这只是一个示例，你可以根据自己的需求进行修改和扩展。
#### 引用[.reference_title]
- *1* *3* [HTML+CSS制作课程表](https://blog.csdn.net/weixin_57037336/article/details/120227541)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
- *2* [HTML制作简单课表](https://blog.csdn.net/IPhoneP40Pro/article/details/125435747)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]