html循环表格数据_HTML表格——构造行星数据

最新推荐文章于 2023-03-10 18:04:33 发布

SiuYeukSze

最新推荐文章于 2023-03-10 18:04:33 发布

阅读量1.2k

点赞数

文章标签： html循环表格数据

本文链接：https://blog.csdn.net/weixin_31307347/article/details/113078294

版权

要完成的步骤

下面的步骤描述了：为了完成这个示例的表格，你所要做的事情。所有你需要的数据都包含在planets-data.txt 文件中。如果你在获得这些数据时遇到了问题，也看看上面的实例，或者尝试绘制一个图。

打开在你本地环境中的 blank-template.html副本，提供一个外部容器来初始化表格，一个表格 header，一个表格 body。在这个例子中，你不需要表格 footer 。
为你的表格添加我们提供的标题。
在表格的 header 中添加一行，用来包括所有列的标题。
在表格的 body 部分创建所有内容行，记住要让所有是行标题的单元格语义化。
确保所有内容都插入了正确的单元格，在原始数据中，每行行星数据都显示在其相关行星的旁边。
添加一些属性，让行标题和列标题更加明确地与和它们有关的单元格进行关联，使用 rowgroups 让子标题和父标题也进行关联。
为包含所有行星标题的行标题的那一列数据，添加一个黑色边框。

代码：

<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <title>Planet-data...</title>
    <link href="minimal-table.css" rel="stylesheet" type="text/css">
</head>

<body>
    <h1>太阳系行星数据</h1>
    <table>
        <caption>太阳系中行星的一些数据。
            <a href="https://nssdc.gsfc.nasa.gov/planetary/factsheet/" target="_blank">（资料及图片取自 NASA 行星数据（公制单位））</a>
        </caption>
        <colgroup>
            <col span=2>
            <col style=

最低0.47元/天解锁文章

SiuYeukSze

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
html循环表格数据_HTML表格——构造行星数据

要完成的步骤下面的步骤描述了：为了完成这个示例的表格，你所要做的事情。所有你需要的数据都包含在planets-data.txt 文件中。如果你在获得这些数据时遇到了问题，也看看上面的实例，或者尝试绘制一个图。打开在你本地环境中的 blank-template.html副本，提供一个外部容器来初始化表格，一个表格 header，一个表格 body。在这个例子中，你不需要表格 footer 。为你的...
复制链接

扫一扫