Use kbd tag to create keyboard input shortcuts using Bootstrap classes in HTML,PHP

How to show keyboard shortcut keys on web pages to perform some tasks like copy,paste,print,select all with bootstrap.

In this tutorial we are using kbd html tag with bootstrap class to show keyboard shortcut keys on webpages which tell the user that you can do this certain task by simply pressing these keys. So here is the complete step by step tutorial for Use kbd tag to create keyboard input shortcuts using Bootstrap classes in HTML,PHP.

How to Use kbd tag to create keyboard input shortcuts using Bootstrap classes in HTML,PHP.

https://www.android-examples.com/demo/heading-tag.html
Code for kbd-tag.html file.

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Keyboard input shortcuts</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

</head>

<body>

<div class="container">
<h1>Keyboard input shortcuts</h1>
 
<p> To Copy Press <kbd>CTRL + C</kbd></p>
<p> To Paste Press <kbd>CTRL + V</kbd></p>
<p> To Print Press <kbd>CTRL + P</kbd></p>
 
</div>
</body>
</html>

Screenshot:

Use kbd tag to create keyboard input shortcuts using Bootstrap classes in HTML,PHP

Leave a Reply

Your email address will not be published. Required fields are marked *