多语言展示
当前在线:261今日阅读:113今日分享:31

第九章 使用HTML 5创建表格

HTML中的表格不仅可以清晰地显示数据,而且可以用于页面布局。类似于Word中的表格。
工具/原料

PC机

方法/步骤
1

目录

2

9.1   案例 1——表格的基本结构 HTML中的表格不仅可以清晰地显示数据,而且可以用于页面布局。类似于Word中的表格。

3

HTML中的表格标记如下:1、

用于表示一个表格对象的开始,
表示结束,只允许出现一对标记。HTML5中不再支持它的任何属性。2、表示表格的行,有多少对就有多少行。3、
表示单元格数量。!DOCTYPE html>表格基本结构                                从预览图中,可以发现,表格没有边框,行高及列宽无法控制。td只提供了两个单元格合并属性。

4

9.2  创建表格

5

【例9.2】创建普通表格

一列:

A1B1C1
A2B2C2
 
100

一行三列:

     
100200300

两行三列:

                  

6

【例9.3】创建一个带有标题的表格

带有标题的表格

100200300
400500600
                  

7

编辑表格

8

9.3.1  案例4——定义表格的边框类型使用表格的border属性可以定义表格的边框类型。【例9.4】创建不同的边框类型的表格

普通边框

数据统计表
100200300
400500600
         
FirstRow
SecondRow

加粗边框

            
FirstRow
SecondRow

9

9.3.2  案例5——定义表格的表头表格中也存在表头,常见的表头分为水平和垂直两种。

水平的表头

              
姓名性别电话
张三56789

垂直的表头

                   
姓名小丽
性别
电话56789

10

9.3.3 案例6——设置表格背景1、定义表格背景颜色

背景颜色

         
100200
300400