码农教程 - 一技在手,衣食无忧! tools

HTML <kbd> 标签

❮上一节 完整的 HTML参考 下一节❯

示例

在文档中定义一些文本作为键盘输入：

<p>Press <kbd>Ctrl</kbd> + <kbd>C</kbd> to copy text (Windows).</p>

<p>Press <kbd>Cmd</kbd> + <kbd>C</kbd> to copy text (Mac OS).</p>
亲自试一试 »

下面有更多 "亲自试一试" 示例。

定义和用法

这个<kbd>标签用于定义键盘输入。里面的内容以浏览器默认的等宽字体显示。

提示：该标签并未被弃用。然而，通过使用 CSS 可以实现更丰富的效果（参见下面的示例）。

另请参阅：

Tag Description
<code> Defines a piece of computer code
<samp> Defines sample output from a computer program
<var> Defines a variable
<pre> Defines preformatted text

浏览器支持

Element
<kbd> Yes Yes Yes Yes Yes

全局属性

这个<kbd>标签还支持HTML 中的全局属性。

事件属性

这个<kbd>标签还支持HTML 中的事件属性。

更多示例

示例

使用 CSS 设置 <kbd> 元素的样式：

<html>
<head>
<style>
kbd {
  border-radius: 2px;
  padding: 2px;
  border: 1px solid black;
}
</style>
</head>
<body>

<p>Press <kbd>Ctrl</kbd> + <kbd>C</kbd> to copy text (Windows).</p>
<p>Press <kbd>Cmd</kbd> + <kbd>C</kbd> to copy text (Mac OS).</p>

</body>
</html>
亲自试一试 »

相关页面

HTML 教程：HTML 文本格式

HTML DOM 参考：Kbd 对象

默认 CSS 设置

大多数浏览器都会显示<kbd>具有以下默认值的元素：

示例

kbd {
  font-family: monospace;
}
亲自试一试 »


❮上一节 完整的 HTML参考 下一节❯