Open In App

HTML | pattern Attribute

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Share
Report issue
Report

This attribute is used to specify the regular expression on which the input element value is checked. This attribute works with the following input types: text, password, date, search, email, etc. Use the Global title attribute to describe the pattern for helping the user. 

Syntax:

<input pattern = "regular_exp">

Element: This attribute is associated with <input> element only. 

Attribute: This attribute specifies the regular expression. 

Example: 

HTML




<!DOCTYPE html>
<html>
 
<head>
    <title>pattern attribute</title>
    <style>
        body {
            text-align: center;
        }
 
        h1 {
            color: green;
        }
    </style>
</head>
 
<body>
    <h1>GeeksforGeeks</h1>
    <h2>pattern attribute</h2>
    <form action="#">
        <label for="userPass">Password:</label>
        <input type="text" name="password" id="userPass" pattern="[A-Za-z]{3}" title="3 letter Password">
        <input type="submit" value="submit">
    </form>
</body>
 
</html>


Output1:

 

  

Output2:  (When entering a password of more than 3 characters)

 

Supported Browsers: The browser supported by pattern attribute are listed below:

  • Google Chrome 4.0 and above
  • Edge 12 and above
  • Firefox 4.0 and above
  • Opera 12.1 and above
  • Safari 5 and above

Last Updated : 13 Dec, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads