HTML-table表格详解

作者：System 时间：2024年08月13日分类：所有,css3 字数：1043

HTML表格（table）是一个非常常见的元素，用于在网页上创建结构化数据。以下是一个简单的HTML表格示例，包含标题、表头和一些数据行：




<!DOCTYPE html>
<html>
<head>
    <title>简单表格</title>
</head>
<body>
    <table border="1">
        <caption>用户信息表</caption>
        <thead>
            <tr>
                <th>姓名</th>
                <th>年龄</th>
                <th>职业</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>张三</td>
                <td>28</td>
                <td>软件工程师</td>
            </tr>
            <tr>
                <td>李四</td>
                <td>25</td>
                <td>产品经理</td>
            </tr>
            <tr>
                <td>王五</td>
                <td>32</td>
                <td>项目经理</td>
            </tr>
        </tbody>
    </table>
</body>
</html>

在这个例子中：

<table> 标签定义表格。
<caption> 标签定义表格的标题。
<thead> 标签定义表头部分，用于包含表头行。
<tbody> 标签定义表的主体部分，用于包含数据行。
<th> 标签定义表头单元格，通常文本会居中并加粗显示。
<tr> 标签定义表格中的行。
<td> 标签定义表格中的单元。

border="1" 属性用于给表格添加边框，你也可以使用 CSS 来控制表格的样式。

HTML-table表格详解

评论已关闭

推荐阅读