html表格定义

最新推荐文章于 2023-09-13 10:22:13 发布

李英涵

最新推荐文章于 2023-09-13 10:22:13 发布

阅读量1.6k

点赞数 2

文章标签： html 前端

本文链接：https://blog.youkuaiyun.com/weixin_51241884/article/details/123359399

版权

这篇博客介绍了如何使用HTML的表格元素创建一个课程时间表。通过`<table>`, `<tr>`, `<th>`, `<td>`等标签，结合`rowspan`和`colspan`属性实现单元格的跨行和跨列，展示了详细的每日课程安排，包括上午和下午的时段以及各科目的分布。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

table：定义表格
border：规定表格边框的宽度
width ：规定表格的宽度
cellspacing：规定单元格之间的空白

<table cellspacing="0" width="500" border="1">

tr ：定义行
align：定义表格行的内容对齐方式

td ：定义单元格
rowspan:规定单元格可横跨的行数 rowspan="x"后跟合并格数x
colspan:规定单元格可横跨的列数 colspon="x"后跟合并格数x

<tr>
            <th colspan="2"> </th>
            <th>星期一</th>
            <th>星期二</th>
            <th>星期三</th>
            <th>星期四</th>
            <th>星期五</th>
        </tr>

在这里插入图片描述

<table cellspacing="0" width="500" border="1">
        <tr>
            <th colspan="2"> </th>
            <th>星期一</th>
            <th>星期二</th>
            <th>星期三</th>
            <th>星期四</th>
            <th>星期五</th>
        </tr>
        <tr align="center">
            <td rowspan="4">上午</td>
            <td>早自习</td>
            <td>英语</td>
            <td>语文</td>
            <td>英语</td>
            <td>语文</td>
            <td>语文</td>
        </tr>
        <tr align="center">
            <td>第一节</td>
            <td>数学</td>
            <td>数学</td>
            <td>速学</td>
            <td>语文</td>
            <td>语文</td>
        </tr>
        <tr align="center">
            <td>第二节</td>
            <td>数学</td>
            <td>数学</td>
            <td>速学</td>
            <td>语文</td>
            <td>语文</td>
        </tr>
        <tr align="center">
            <td>第三节</td>
            <td>数学</td>
            <td>数学</td>
            <td>速学</td>
            <td>语文</td>
            <td>语文</td>
        </tr>
        <tr align="center">
            <td colspan="7">午休</td>
        </tr>
        <tr align="center">
            <td rowspan="3">下午</td>
            <td>第四节</td>
            <td>数学</td>
            <td>数学</td>
            <td>速学</td>
            <td>语文</td>
            <td>语文</td>
        </tr>
        <tr align="center">
            <td>第五节</td>
            <td>数学</td>
            <td>数学</td>
            <td>速学</td>
            <td>语文</td>
            <td>语文</td>
        </tr>
        <tr align="center">
            <td>第六节</td>
            <td>数学</td>
            <td>数学</td>
            <td>速学</td>
            <td>语文</td>
            <td>语文</td>
        </tr>
    </table>```