2019-07-06 表格

知识点

表格元素
表格的基本构成最少需要三个元素：

、、中只能嵌套
标签，他就像一个容器，可以容纳所有的元素。

border 设置表格的边框
cellspacing 设置单元格与单元格边框之间的空白间距
cellpadding 设置单元格内容与单元格边框之间的空白间距
width 设置表格的宽度
height 设置表格的高度
align 设置表格在网页中的水平对齐方式

在使用表格进行布局时，可以将表格划分为头部、主体和页脚具体如下所示：

：用于定义表格的头部。
必须位于

，其他的一些作为可选辅助存在。 table 表示表格 thead 表示标题行 tbody 表示表格主体 tfoot 表示表脚 tr 表示一行单元格 th 表示标题行单元格 td 表示单元格 col 表示一列 colgroup 表示一组列 caption 表示表格标题 注意:

标签中，一般包含网页的logo和导航等头部信息。
:用于定义表格的主体。
位于标签中，一般包含网页中除头部和底部之外的其他内容。

浏览器中审查HTML标签元素F12

表格的标题：caption

定义和用法

caption元素定义表格标题。

我是表格标题

caption标签必须紧随table标签之后。您只能对每个表格定义一个标题。通常这个表格会居中于这个表格之上。

合并单元格

跨行合并：rowspan 跨列合并：colepan

猫和老鼠演员表

姓名	性别	年龄
汤姆	男	22
杰瑞	男	21

跨行、跨列合并后：

猫和老鼠演员表

姓名	性别	年龄
汤姆	男	22
杰瑞	男

猫和老鼠演员表

姓名	性别	年龄
汤姆	男	22
杰瑞	男

代码

我的表格 

    
猫和老鼠演员表
    

    

        
姓名
        
性别
        
年龄
    
    
    

    

        
汤姆
        
男
        
22
    
    

        
杰瑞
        
男

    
  




    
猫和老鼠演员表
    

    

        
姓名
        
性别
        
年龄
    
    
    

    

        
汤姆
        
男
        
22
    
    

        
杰瑞
        
男

    
    




    
猫和老鼠演员表
    

    

        
姓名
        
性别
        
年龄
    
    
    

    

        
汤姆
        
男
        
22
    
    

        
杰瑞
        
男

    
    

        
卡卡西
        
女

    
    

        
卡卡东
        
女

    
    




    
猫和老鼠演员表
    

    

        
姓名
        
性别
        
年龄
    
    
    

    

        
汤姆
        
男
        
22
    
    

        
杰瑞
        
男
        
22
    
    

        
杰瑞西

    
    

        
汤姆东
        
男
        
22
    
    

结果

image.png

image.png