kbd element

If you don't know what an element is or how you must use it, I recommend you read the "HTML tags and attributes" tutorial that you can find in the HTML tutorials section.

Description

The kbd element represents a user input that could be made by keyboard or any other medium, like mouse, touchscreen or voice command.

When the samp element is containing a kbd element, it represents a piece of computer sample, where the output includes a command or text that was input by the user.

When the kbd element is containing a samp element, it represents a user input that's been made based on a computer output, like for example, a menu command.

Examples

The first example, contains instructions to copy and paste some text. The keys that must be pressed are wrapped with they kbd element, as they represent the input the user should make.

<p>Press <kbd>Ctrl</kbd> and hold it while you press <kbd>C</kbd>. Then move to the second document and press <kbd>Ctrl</kbd> and hold it while you press <kbd>V</kbd>.</p>

Press Ctrl and hold it while you press C. Then move to the second document and press Ctrl and hold it while you press V.

The second example, shows an explanation of the procedure to print a document in a text processor. Here the kbd element is wrapping some samp elements that represent the items in a menu provided by the program (this is, an output).

<p>To print your document go to <kbd><samp>File</samp><samp>Print...</samp></kbd>, and when the window pops up press <kbd><samp>Ok</samp></kbd>.</p>

To print your document go to FilePrint..., and when the window pops up press Ok.

The third and last example, shows an output made by the computer (samp) that includes text previously entered by the user (kbd). All the text is wrapped with the pre element to preserve the output format.

<pre><samp>Enter your name: <kbd>Jhon Doe</kbd>
Oh! It's you again!
Searching record...</samp></pre>
Enter your name: Jhon Doe
Oh! It's you again!
Searching record...

Attributes

Global attributes

For information about global attributes refer to this list of global attributes in HTML5.

Events

Global events

For information about global events refer to this list of global events in HTML5.