小白学习html一些笔记——7.表格标签

最新推荐文章于 2024-08-10 22:11:57 发布

NiaYoop

最新推荐文章于 2024-08-10 22:11:57 发布

阅读量56

点赞数

分类专栏：自学分享小白编程文章标签： html css

本文链接：https://blog.csdn.net/niayooop/article/details/115058667

版权

自学分享同时被 2 个专栏收录

25 篇文章 0 订阅

订阅专栏

小白编程

24 篇文章 0 订阅

订阅专栏

表格标签:<table> <tr> <td> </td> </tr> </table>

表格标签比较特殊，我的理解是table是建立一个大的框，tr是建立一行,td是一个单元格。具体解释还是没那么清楚，如果用代码相信会更好的理解。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格标签</title>
    </head>
<body>
    <table border="1" width="50%" cellpadding="0" cellspacing="0" bgcolor="#ffe4c4" align="center">
        <tr>
            <th>学号</th>
            <th>姓名</th>
            <th>成绩</th>
        </tr>
        <tr>
            <td>1</td>
            <td>张三</td>
            <td>93</td>
        </tr>
        <tr>
            <td>2</td>
            <td>李四</td>
            <td>64</td>
        </tr>
    </table>
    <hr>
    <table border="1" width="50%" cellpadding="0" cellspacing="0" bgcolor="#ffe4c4" align="center">
        <caption>学生成绩表</caption>

        <thead>
        <tr>
            <th>学号</th>
            <th>姓名</th>
            <th>成绩</th>
        </tr>
        </thead>

        <tbody>
        <tr>
            <td>1</td>
            <td>张三</td>
            <td>93</td>
        </tr>
        <tr>
            <td>2</td>
            <td>李四</td>
            <td>64</td>
        </tr>
        </tbody>

        <tfoot>
        <tr>
            <td>3</td>
            <td>王五</td>
            <td>15</td>
        </tr>
        </tfoot>

    </table>
    <hr>
    <table border="1" width="50%" cellpadding="0" cellspacing="0" bgcolor="#ffe4c4" align="center">
        <tr bgcolor="#ffd700" align="center">
            <th rowspan="2">学号</th>
            <th>姓名</th>
            <th>成绩</th>
        </tr>
        <tr>

            <td>张三</td>
            <td>93</td>
        </tr>
        <tr>
            <td>2</td>
            <td colspan="2" align="center">李四</td>

        </tr>

    </table>
   <hr>
<table border="1" cellspacing="0" cellpadding="0" width="50%" align="center">
    <caption>学生成绩表</caption>
    <tr>
        <td>编号</td>
        <td>姓名</td>
        <td>性别</td>
        <td>成绩</td>
    </tr>
    <tr>
        <td>1</td>
        <td>小龙女</td>
        <td>女</td>
        <td>100</td>
    </tr>
    <tr>
        <td>2</td>
        <td>杨过</td>
        <td>男</td>
        <td rowspan="2" align="center">90</td>

    </tr>
    <tr>
        <td>3</td>
        <td>金轮法王</td>
        <td>男</td>

    </tr>
    <tr>
        <td>总成绩</td>
        <td colspan="3" align="center">190</td>
    </tr>
</table>
</body>
</html>

在这里插入图片描述

NiaYoop

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
小白学习html一些笔记——7.表格标签

表格标签:<table> <tr> <td> </td> </tr> </table>表格标签比较特殊，我的理解是table是建立一个大的框，tr是建立一行,td是一个单元格。具体解释还是没那么清楚，如果用代码相信会更好的理解。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF
复制链接

扫一扫

专栏目录