你可能从未听说过的HTML功能。

由 Mux 赞助的 DEV 全球展示挑战赛：展示你的项目！

我是 codereaper08，再次向大家问好！
再次感谢所有关注我的人，尽管我的学业安排很紧，但你们一直激励着我每周坚持写博客。

希望我又带来了一篇好文章。在本文中，我们将讨论HTML中5个我们可能从未听说过的特性。那么，让我们开始吧。

1. WBR 标签：

让我们从列表中的第一个开始，wordbreak标签（tag），缩写为<wbr>。你可能会想，它存在的意义是什么？嗯，它不像br我们常用的那些方便的标签。<wbr>除非必要，否则它不会强制单词换行。wbr标签是一个空标签（没有结束标签）。

我们将对比<wbr>和<br>，调整浏览器窗口大小，看看 如何wbr在必要情况下崩溃。

2. 地址标签：

想用div`<a>` 标签来包裹联系信息吗？
HTML 提供了一种语义化很好的方法，即使用<address>`<a>` 标签。那么使用 ` <address><a>` 标签有什么不同呢？它会将文本渲染为斜体，并在标签上方和下方自动换行<address>。此外，它还默认具有 `display` 属性block。请查看下面的 JSFiddle 示例。

3. optgroup 标签：

<optgroup>当您需要将选项分组到不同的类别中时，可以使用 `<category>` 标签。这样可以轻松地从大量的选项列表中选择所需选项！用户可以查看相关的类别，并在该类别中选择相应的选项。我在下面的 JSFiddle 示例中
创建了一个超级英雄角色进行演示。optgroup

4. 门户标签：

现在精彩的部分来了！我们将看到一个名为 `<div>` 的标签。这是Google在 2019 年 I/O 开发者大会上<portal>推出的，他们提到 `<div> ` 将是 `<div>` 的升级版。` <div>` 还允许在嵌入内容内进行无缝导航！遗憾的是，包括主流的Google Chrome在内的许多浏览器都不支持它。目前，只有Chrome Canary 版本支持该标签。请观看下面的演示视频。<portal><iframe><portal><portal>

5. 输入元素的捕获属性：

最后，我们将了解capture输入元素的属性。capture添加到输入元素的属性会打开摄像头，用于拍摄用户（前置摄像头）或场景（后置摄像头）。此标签仅在移动设备上有效，在桌面端会回退到文件选择器。capture属性有两个值：

— 用户 --> 打开用户前置摄像头
— 环境 --> 打开环境后置摄像头

请查看下面的 JSFiddle 示例。

今天就到这里啦！觉得我漏掉了什么吗？欢迎在评论区留言，我会很乐意补充。喜欢这篇文章吗？请点个赞💖吧！感谢阅读，祝您愉快😄