网站（四）HTML5表格元素

最新推荐文章于 2021-11-17 18:39:24 发布

KeithAlexander

最新推荐文章于 2021-11-17 18:39:24 发布

阅读量346

点赞数

分类专栏：学习笔记

本文链接：https://blog.csdn.net/KeithAlexander/article/details/80957133

版权

学习笔记专栏收录该内容

38 篇文章 0 订阅

订阅专栏

HTML5表格元素

表格三大元素

table
tr
td

表格常用元素

border：边框
align：对齐模式
colspan：合并行单元格
rowspan：合并列单元格

<!DOCTYPE html>  <!--让浏览器得知自己要处理的内容是html--> 
<!--这是注释-->

<html len="zh"><!--文档中html部分的开始， language = 简体中文-->

<head><!--提供有关文档内容和标注信息的-->

    <meta charset="UTF-8"><!--用UTF-8的方式将网页进行编码-->

    <title>Title</title><!--标题-->
</head>

<body>
<table border = "1px" align = "center"> <!--border边框，align对齐模式-->
    <thead>
    <tr>
        <th>Admin</th> <!--th为表格标题-->
        <th>Sex</th>
        <th>Password</th>
    </tr>
    </thead>
    <tbody>
    <tr><!--一行-->
        <td>Saber</td><!--td表示一列-->
        <td>Female</td>
        <td>I am king of eating!</td>
    </tr>
    <tr>
        <td>Lancer</td>
        <td>Male</td>
        <td>Luck E!</td>
    </tr>
    </tbody>
    <tfoot>
        <td>Admin</td>
        <td>Sex</td>
        <td>Password</td>
    </tfoot>
</table>

<br>
<table border="1px" align="center">
    <tr>
        <th rowspan = "2">I love study!</th>
        <th>I love study!</th>
        <th>I love study!</th>
        <th>I love study!</th>
    </tr>
    <tr>
        <td colspan="2">I love study!</td>
        <td>I love study!</td>
    </tr>
    <tr>
        <td>I love study!</td>
        <td>I love study!</td>
        <td>I love study!</td>
        <td>I love study!</td>
    </tr>
</table>
</body>
</html>