HTML <input type=”tel”>

The HTML <input type=”tel”> element creates a telephone number input field, specifically designed for entering phone numbers. It provides features like input validation for telephone numbers and may include special characters like parentheses and hyphens for formatting. This element helps ensure that users enter phone numbers correctly in web forms.

Syntax

<input type="tel"> 

Example: This example demonstrates the use of HTML <input type=”tel”> element.

HTML
<!DOCTYPE html>
<html>

<head>
    <title>HTML Input Type Tel</title>
</head>

<body style="text-align:center;">
    <h2>HTML &lt;input type="tel"&gt;</h2>

    <form action="#">
        <label for="contact">Phone No:</label>
        <input type="tel" id="contact" 
            pattern="[0-9]{3}-[0-9]{3}-[0-9]{4}" 
            required />

        <input type="submit" value="Submit">
    </form>
</body>

</html>

Output

Supported Browsers

  • Chrome 3
  • Edge 12
  • Firefox
  • Opera 11
  • Safari 4