3.Date

This allows users to select a date from a calendar-style picker in supported browsers.

<input type="date" name="birthday">

Example:

4.Email

It helps validate the input to ensure that the entered value looks like an email address (for example, containing an “@” symbol and a domain).

<input type="email" name="email">

Example:

5.Range

The <input> element with the type="range" allows you to create a slider control.

<input type="range" min="0" max="100">

Example:

6.Number

This helps ensure that the value entered by the user is a number, and it provides basic validation to ensure only numbers are inputted.

<input type="number" name="quantity" min="1" max="10" >

Example:

7.Min & Max

The min attribute defines the minimum acceptable value for an input field. The max attribute sets the maximum acceptable value for an input field.

<input type="number" min="1" max="100">

Example:

8.Pattern

HTML5 is used in <input> elements to specify a regular expression (regex) that the input’s value must match in order for the form to be submitted.

<input type="text" id="phone" name="phone" pattern="\d{3}[-]\d{3}[-]\d{4}" >

Example:

9.Placeholder

HTML5, the placeholder attribute is used in form elements like <input> and <textarea> to display a short hint or example of what should be entered into the field.

<input type="text" placeholder="Enter your name">

Example:

10.Readonly

HTML5, the readonly attribute is used to make an input field non-editable, but the value of the field can still be sent when submitting the form

<input type="text" name="username" readonly>

Example:

11.Required

HTML5, the required attribute is used in form elements to specify that the field must be filled out before submitting the form.

<input type="text" name="username" required>

Example:

12.Value

HTML5 is commonly used in form elements like <input>, <textarea>, <option>, etc. to define the initial value or the value that gets submitted with the form.

<input type="text" name="username" value="Think4U">

Example: