HTML表格今日总结

最新推荐文章于 2023-02-18 20:49:10 发布

ws_991119

最新推荐文章于 2023-02-18 20:49:10 发布

阅读量169

点赞数

分类专栏：笔记

本文链接：https://blog.csdn.net/weixin_45379031/article/details/108210017

版权

笔记专栏收录该内容

6 篇文章 0 订阅

订阅专栏

HTML表格今日总结

table、tr和td——生成基本的表格；

th——为表格添加表头单元格；

thead——标记表格的标题行；

tbody——表示构成表格主体的全体行；

tfoot——标记组成表脚的行；

th和td元素定义的colspan和rowspan属性——生成不规则表格单元格；

th和td元素定义的headers属性——将单元格与表头相关联以满足残障辅助技术的需要；

caption——为表格添加标题；

colgroup、col——对表格按列处理而不是按行处理；

使用table元素定义的border属性——表示表格不是用来控制页面布局的；

实例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>Bran.im</title> 
</head>
<body>
   <table border="1">
        <caption>我是表格的标题</caption>
        <thead>
            <tr>
                <td>姓名</td>
                <td>年龄</td>
                <td>性别</td>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>黄小黄</td>
                <td>16</td>
                <td rowspan="2">女</td>
            </tr>
            <tr>
                <td>成二狗</td>
                <td>18</td>
                <!-- <td>女</td> -->
            </tr>
            <tr>
                <td>赵瓜皮</td>
                <td>21</td>
                <td>男</td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td>总计</td>
                <td colspan="2">3人</td>
               
            </tr>
        </tfoot>
    </table>

效果
在这里插入图片描述

ws_991119

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML表格今日总结

HTML表格今日总结able、tr和td——生成基本的表格；th——为表格添加表头单元格；thead——标记表格的标题行；tbody——表示构成表格主体的全体行；tfoot——标记组成表脚的行；th和td元素定义的colspan和rowspan属性——生成不规则表格单元格；th和td元素定义的headers属性——将单元格与表头相关联以满足残障辅助技术的需要；caption——为表格添加标题；colgroup、col——对表格按列处理而不是按行处理；使用table元素定义的border属
复制链接

扫一扫