html中，网页表格表格的一些事，关于td,th,tr

撰卢

已于 2023-10-23 21:40:55 修改

阅读量1.2k

点赞数

分类专栏： Java web 开发从入门到实践文章标签： html 前端

于 2023-09-12 22:46:11 首次发布

本文链接：https://blog.csdn.net/2201_75371220/article/details/132841104

版权

Java web 开发从入门到实践专栏收录该内容

2 篇文章 0 订阅

订阅专栏

html创建表格

以下只记录<body>里面的内容

关于th,td

制作表格

例子：

关于th,td

<th>指的是内容单元格

<td>指的是标题,一般用在一列的第一格,里面的内容会自动加粗加黑

如图（代码会在后面）

用红色圈起来的是用<th>，用篮圈圈起来的是的是用<td> ，可以看出用<th>的文本比用<td>的文本要粗

制作表格

制作表格，需要在<table></table>之间制作

表格要一行一行的写，每一对<tr></tr>都代表一行，每一行要从左到右一个单元格一个单元格的写

先是这样：

再这样

再再这样

最后再这样

如果要一个单元格要霸占多行，在写<td>或者<th>的时候加上rowspan="霸占的行数“

<td rowspan="霸占的行数值”>

例如”基本资料“要占两行：

代码为

<th rowspan="2">基本资料</th>

如果要霸占多列时候，在写<td>或者<th>的时候加colspan="霸占的列数“：

<td rolspan="霸占的列数">

例如”业余爱好“要占5列代码为：

 <th colspan="5">业余爱好</th>

例子：

以下表格

的代码为：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UFT-8">
    <title>Javaweb书本第9页</title>
</head>
    <body>
       <table border="1" style="border-color: green">
            <caption>个人简历</caption>

            <tr>
                <th rowspan="2" >基本资料</th>
                <th align="left">名字</th>
                <td>李小白</td>
                <th align="left">性别</th>
                <td>女</td><!--align="center"-->
            </tr>

            <tr>
                <th align="left">政治面貌</th>
                <td>群众</td>
                <th>出生日期</th>
                <td>1988-12-09</td>
            </tr>

            <tr>
                <th colspan="5">业余爱好</th>
            </tr>
            <tr>
                <td>替身</td>
                <td>各类球类（包括中国足球）</td>
                <td>看言情</td>
                <td>爬山</td>
                 <td>压马路</td>
            </tr>
        </table>
    </body>
</html>