资讯专栏INFORMATION COLUMN

10 个不常用但你有必要知道的 html 标签

shevy / 3268人阅读

摘要:今天我们将介绍您可能不知道的十个标签。虽然不常用,但是一旦遇到使用场景使用起来将是非常方便的。规定元素的名称。用于进度条显示点击此处查看结果标签定义已知范围或分数值内的标量测量。主要作用在于可以方便的被爬虫抓取,从而获得相应的数据。

转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。

概述

HTML 也被称为超文本记语言( hyper text markup language )是为网页创建和其他可在网页浏览器中看到的信息设计的一种标记语言。HTML 被用来结构化信息,如标题、段落和列表等,也可用来在一定程度上描述文档的外观和语义。

今天我们将介绍您可能不知道的十个 HTML 标签。虽然不常用,但是一旦遇到使用场景使用起来将是非常方便的。

如果您想了解有关 HTML 的更多信息,可以访问 W3Schools 获取更多 HTML 信息。

audio:

点击此处查看结果

blockquote

标签定义块引用。
之间的所有文本都会从常规文本中分离出来,经常会在左、右两边进行缩进(增加外边距),而且有时会使用斜体。也就是说,块引用拥有它们自己的空间。

Here comes a long quotation:

This is a long quotation. This is a long quotation. This is a long quotation. This is a long quotation. This is a long quotation.

请注意,浏览器在 blockquote 元素前后添加了换行,并增加了外边距。

点击此处查看结果

output

标签定义不同类型的输出,比如脚本的输出。标签包含以下属性 for 规定一个或多个元素的 id 列表,以空格分隔。这些元素描述了计算中使用的元素与计算结果之间的关系。 form 规定 元素所属的一个或多个表单的 id 列表,以空格分隔。 name 规定 元素的名称。 Internet Explorer 不支持 标签。

0 100 + =

点击此处查看结果

picture

元素通过包含零或多个 元素和一个 元素来为不同的显示 /设备场景提供图像版本。浏览器会选择最匹配的子 元素,如果没有匹配的,就选择 元素的 src 属性中的 URL。然后,所选图像呈现在元素占据的空间中。

picture 标签的属性如下:

srcset (必需) - 定义要显示的图像的 URL

media - 接受通常在 CSS 中定义的任何有效媒体查询( media queries )

例如下面所示




Flowers

根据浏览器的最小宽度的变化,picture 将显示不同的图片

点击此处查看结果

progress

标签标示任务的进度(进程)。用于进度条显示


点击此处查看结果

meter

标签定义已知范围或分数值内的标量测量。也被称为 gauge (尺度)。也可以用于进度条的显示

3/10
60%

点击此处查看结果

template