HTML之表格的基本知识

表格的主要作用
1、表格主要用于显示、展示数据,因为它可以让数据显示的非常的规整,可读性非常好。特别是后台展示数据的时候,能够熟练运用表格就显得很重要。一个清爽简约的表格能够把繁杂的数据表现得很有条理。
总结: 表格不是用来布局页面的,而是用来展示数据的.
在这里插入图片描述
1.2 表格的基本语法
在这里插入图片描述

  1. 是用于定义表格的标签。
  2. 标签用于定义表格中的行,必须嵌套在
    标签中。
  3. 用于定义表格中的单元格,必须嵌套在标签中。
  4. 字母 td 指表格数据(table data),即数据单元格的内容。

3、 表格标签
一般表头单元格位于表格的第一行或第一列,表头单元格里面的文本内容加粗居中显示. 标签表示 HTML 表格的表头部分(table head 的缩写)
在这里插入图片描述 4、表头单元格标签
表头单元格也是单元格, 常用于表格第一行, 突出重要性, 表头单元格里面的文字会加粗居中显示.
5、1.4 表格属性
表格标签这部分属性我们实际开发我们不常用,后面通过 CSS 来设置.
目的有2个:
5. 记住这些英语单词,后面 CSS 会使用.
6. 直观感受表格的外观形态.
6、案例分析
在这里插入图片描述
7、表格结构标签
使用场景:因为表格可能很长,为了更好的表示表格的语义,可以将表格分割成 表格头部和表格主体两大部分.
在表格标签中,分别用:标签 表格的头部区域、标签 表格的主体区域. 这样可以更好的分清表
格结构。在这里插入图片描述
8、表格标签- 合并单元格
特殊情况下,可以把多个单元格合并为一个单元格, 这里同学们会最简单的合并单元格即可.
7. 合并单元格方式
8. 目标单元格
9. 合并单元格的步骤:
(1)合并单元格方式:  跨行合并:rowspan=“合并单元格的个数”
 跨列合并:colspan="合并单元格的个数
合并单元格三步曲:

  1. 先确定是跨行还是跨列合并。
  2. 找到目标单元格. 写上合并方式 = 合并的单元格数量。比如:。
  3. 删除多余的单元格。
    在这里插入图片描述
    9、. 表格的相关属性
    在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/m0_46374969/article/details/111321638