HTML 表格

HTML 中的一个非常常见的任务是构建表格数据,并且它具有许多用于此目的的元素和属性。再加上一点 CSS 的样式,HTML 可以轻松地在 Web 上显示信息表格,例如你的学校课程计划、当地游泳池的时间表或有关你最喜欢的恐龙或足球队的统计数据。本模块将带你了解有关使用 HTML 构建表格数据所需的所有知识。

¥A very common task in HTML is structuring tabular data, and it has a number of elements and attributes for just this purpose. Coupled with a little CSS for styling, HTML makes it easy to display tables of information on the web such as your school lesson plan, the timetable at your local swimming pool, or statistics about your favorite dinosaurs or football team. This module takes you through all you need to know about structuring tabular data using HTML.

先决条件

¥Prerequisites

在开始本模块之前,你应该已经了解了 HTML 的基础知识 - 请参阅 HTML 简介

¥Before starting this module, you should already have covered the basics of HTML — see Introduction to HTML.

注意:如果你正在使用无法创建自己的文件的计算机/平板电脑/其他设备,你可以尝试在线编码程序(例如 JSBinGlitch)中的(大部分)代码示例。

¥Note: If you are working on a computer/tablet/other device where you don't have the ability to create your own files, you could try out (most of) the code examples in an online coding program such as JSBin or Glitch.

指南

¥Guides

本模块包含以下文章,将引导你了解在 HTML 中创建表格的所有基础知识。

¥This module contains the following articles, which will take you through all the fundamentals of creating tables in HTML.

HTML 表格基础知识

本文将带你开始使用 HTML 表格,涵盖非常基础的知识,例如行和单元格、标题、使单元格跨越多个列和行,以及如何将列中的所有单元格组合在一起以设置样式。

HTML 表格的高级功能和辅助功能

本文着眼于 HTML 表格的一些更高级的功能,例如标题/摘要以及将行分组为表头、正文和页脚部分,以及针对视障用户的表格的可访问性。

评估

¥Assessments

以下评估将测试你对上述指南中涵盖的 HTML 表格技术的理解。

¥The following assessment will test your understanding of the HTML table techniques covered in the guides above.

构建行星数据

在我们的表格评估中,我们为你提供了一些有关太阳系行星的数据,并让你将其构建为 HTML 表格。