不推荐使用的Html标签有什么,10 个不常用但你有必要知道的 html 标签

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

概述

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

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

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

audio:

标签定义声音,比如音乐或其他音频流。目前支持三种文件格式:MP3,WAV 和 OGG。

Your browser does not support the audio element.

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

标记内的内容本身是对用户隐藏的,通过 JS 可以将其用于重复实例化显示。相当有定义了一个模板,该模板可以通过 JS 重复被调用展示。

例如下面定义模板:

%E2%80%9D

在 JS 中可以通过 cloneNode() 方法,来重复实例化显示该模板中的内容:

const template = document.querySelecor(‘ template ’);

const templateClone = myTemplate.content.cloneNode(true);

document.body.appendChild(templateClone);

time

标签定义公历的时间( 24 小时制)或日期,时间和时区偏移是可选的。

time 主要作用在于可以方便的被爬虫抓取,从而获得相应的数据。

time 本身对页面布局没有任何影响

例如:

我们在每天早上 9:00 开始营业。

video

与相对应, 标签定义视频,比如电影片段或其他视频流。

your browser does not support the video tag

wbr

wbr 是 Word Break Opportunity 的简写,规定在文本中的何处适合添加换行符。

例如下面的对于较长的单词 XMLHttpRequest 希望在换行时候能够截断换行而不是整个换行的情况下可以使用,下面的代码在换行的时候截断成 XML Http Request 分别进行换行,而不是 XMLHttpRequest 整个进行换行。

如果想学习 AJAX,那么您必须熟悉 XMLHttpRequest 对象。

本文是由葡萄城技术开发团队发布,转载请注明出处:葡萄城官网

了解可嵌入您系统的在线 Excel,请前往SpreadJS 纯前端表格控件

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值