How to set float input type in HTML5 ?

How to define keyboard input in HTML5 ?

Last Updated : 12 Jul, 2025

The phrase tag is used to define the keyboard input. The text enclosed by <kbd> tag is typically displayed in the browser’s default monospace font. In this article, we define the keyboard input by using various types of tags like <kbd>, <code>, <em>, <var>, and <samp>. Syntax:

<kbd> Contents... </kbd>

Example 1:

html

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>
        How to define keyboard input
    </title>
</head>

<body>
    <h2>
        How to define a various
        Keyboard input.
    </h2>

    <kbd>GeeksForGeeks</kbd>

    <em>It is a emphasized text</em>
    <br />

    <strong>
        It is a Strong text
    </strong>
    <br />

    <code>
        It is a piece of
        computer code
    </code>
    <br />

    <samp>
        Sample output from a computer program
    </samp>
    <br />

    <kbd>Keyboard input</kbd><br />
    <var>Variable</var>
</body>

</html>

Output:

Example 2:

html

<!DOCTYPE html>
<html>

<head>
    <title>
        How to define keyboard 
        input in HTML5?
    </title>

    <style>
        body {
            text-align: center;
        }
    </style>
</head>

<body>
    <div class="gfg">
        GeeksforGeeks
    </div>

    <h2>
        <kbd>
            HTML5: How to define 
            keyboard input?
        </kbd>
    </h2>
    
    <kbd>A computer</kbd>
    <kbd>science</kbd>
    <kbd>portal</kbd>
</body>

</html>

Output:

Supported Browsers:

Google Chrome
Internet Explorer
Firefox
Opera
Safari

How to set float input type in HTML5 ?

M

manaschhabra2

Improve

Article Tags :

Similar Reads

How to set float input type in HTML5 ?

HTML5 is the latest version of Hypertext Markup Language (HTML), the standard language for creating web pages and web applications. With HTML5, new input types were introduced to make web form creation easier and more accessible. These input types include text, password, checkbox, radio, submit, res

How to Add Input Field inside Table Cell in HTML ?

In HTML, adding input fields inside the table cells can be done to make the application user interactive and useful in the scenarios of building forms, data entry systems, etc. Below are the approaches to add input field inside a Table Cell in HTML: Table of Content Using 'input' tagUsing data Attri

How to define a form for user input using HTML5 ?

In this article, we will learn how to create a form in a webpage by using the <form> tag. This tag is used to create form for user input. Also there are many elements which are used within form tag. Syntax: <form> Form Content... </form> Example: The following code snippet demonstr

How to define a form for user input using HTML5 ?

In this article, we will learn how to create a form in a webpage by using the <form> tag. This tag is used to create form for user input. Also there are many elements which are used within form tag. Syntax: <form> Form Content... </form> Example: The following code snippet demonstr

How to Create Keyboard Shortcuts in JavaScript ?

This article will demonstrate how to create keyboard shortcuts in JavaScript. We can manually set user-defined functions for different shortcut keys. Keyboard shortcuts allow users to perform actions quickly by pressing a combination of keys, such as Ctrl + S for saving, Ctrl + C for copying, or cus

HTML | DOM KeyboardEvent

It refers to the events which occur when a key is pressed on the keyboard. Syntax: <input type="text" onkeypress/onkeydown/onkeyup="function()/event"> Events:The following events occur on pressing a key- onkeydownonkeypressonkeyup Properties: altKey: It returns if alt key was pressed or not.ch