11/15/22, 8:06 PM Using the HTML <kbd></kbd> tag to show keyboard shortcuts in your webpages, HTML

Home About Videos News Links Support Us

Category: HTML
Added: 2nd of October 2022 Links
Viewed: 174 times
Amazon (UK Site)
Amazon (US Site)
Using the HTML <kbd></kbd> tag to show CrossOver Office
keyboard shortcuts in your webpages gog.com
Linode
If you need to show keyboard shortcuts in your own webpages you can NordVPN
The Linux Foundation
use the HTML <kbd></kbd> tag to highlight various parts of the text.

Examples:

Other Tips &

Show hidden files on Linux, press CTRL + h

Tutorials
Paste text on Linux, press CTRL + v

HTML

You will want to add your own styling via CSS, as it's hard quite hard to Use the HTML
distinguish the highlighted parts of the text without it.
<mark></mark>
tag to highlight text
Create a new file on your Desktop named kdb.html, copy and paste the on your webpages
code below then save the file. Launch the file in your browser.

Posted: 2nd of October

<style>
2022
kbd
Views: 133
{

background:lightgrey;

border:1px solid black;

HTML
border-radius:5px;

padding:4px;

Using the HTML

}
<kbd></kbd> tag
</style>
to show keyboard
<p>Show hidden files on Linux, press <kbd>CTRL</kbd> +
<kbd>h</kbd></p>
shortcuts in your
<p>Paste text on Linux, press <kbd>CTRL</kbd> + <kbd>v</kbd> webpages
</p>

Posted: 2nd of October

2022
My Computer Tips - Related Links Views: 174

You might be interested in the following tips / tutorials

HTML
1) Using the HTML <kbd></kbd> tag to show keyboard shortcuts in
How do I display a
your webpages
popup calendar
using HTML5
Posted: 4th of February
2020
Views: 2845

https://www.mycomputertips.co.uk/321 1/2