HTML <kbd> tag is utilized to denote inline text that signifies user keyboard input, voice input, or input from any other text entry device.
The <kbd> content appears on the browser using the default monospaced font. This is employed when a webpage requires the precise display of text that users need to input directly from their keyboards.
Note: We can also use CSS properties to get the same display effect as <kbd> tag.
Syntax
Example
<kbd>Enter Keyboard input</kbd>
Here are some details regarding the HTML <kbd> element:
| Display | Inline |
|---|---|
| Start tag/End tag | Both Start and End tag |
| Usage | Textual |
Example
Example
<!DOCTYPE html>
<html>
<head>
<title>Kbd Tag</title>
<style>
kbd { border: 1px solid blue;
border-radius: 8px;
padding: 3px 5px;
margin: 2px;
}
</style>
</head>
<body>
<h2>Example of Kbd tag</h2>
<p>If you are using MS document then you can use shortcut <kbd>ctrl + s</kbd> to save your current document. </p>
</body>
</html>
Output:
Attribute
Tag-specific attribute
The <kbd> element does not contain any particular attribute.
Global attribute
The < kbd > tag facilitates the utilization of global attributes within HTML.
Event attribute
The < kbd > tag enables the utilization of event attributes within HTML.
Supporting Browsers
| Element | Chrome | IE | Firefox | Opera | Safari |
|---|---|---|---|---|---|
<kbd> |
Yes | Yes | Yes | Yes | Yes |