发布于 2026-01-06 0 阅读
0

<kbd> HTML 标签

<kbd> HTML 标签

欢迎来到非常用HTML标签系列的第二部分!

在本系列文章中,我将逐一介绍一个鲜为人知的 HTML 标签,讨论其在不同浏览器间的兼容性,并介绍该元素的一些实际应用案例。

<kbd>标签

<kbd></kbd>标签用于定义文档中的用户输入,默认情况下,它使用浏览器的等宽字体以进行视觉区分。

虽然此标签最常见的用途是表示键盘输入,但它也可以用于语音或其他命令等输入。

让我们来看看它是如何使用的!

<p>To open a new tab on Mac, press 
   <kbd>Cmd</kbd> + <kbd>T</kbd>.
</p>

<p>To open a new tab on Windows, press 
   <kbd>Ctrl</kbd> + <kbd>T</kbd>.
</p>
Enter fullscreen mode Exit fullscreen mode

Screen Shot 2021-01-08 at 10.35.54 AM.png

开始标签和结束标签都是必需的,并且与我们讨论过的其他一些 HTML 标签不同,它不包含任何唯一属性(可以使用全局属性)。

如果您想让标签的内容更加突出,可以考虑应用一些自定义 CSS。

Screen Shot 2021-01-08 at 10.36.23 AM.png

如果你想尝试修改标签,欢迎复制下面的代码!

兼容性

<kbd></kbd>标签是 HTML Living Standard 的一部分,所有主流浏览器都支持该标签!

Screen Shot 2021-01-08 at 10.37.30 AM.png

结论

感谢阅读!你之前<kbd></kbd>在项目中使用过这个标签吗?请在下方评论区留言告诉我!

如果您喜欢这篇文章并想了解更多类似内容,请阅读我的其他文章订阅我的新闻简报,并务必在Twitter上关注我!

文章来源:https://dev.to/braydoncoyer/the-kbd-html-tag-2n2o