Ensuring a Value Is an E-mail Address or URL - HTML CSS HTML Tag

HTML CSS examples for HTML Tag:input

  1. HOME
  2. HTML CSS
  3. HTML Tag
  4. input

Introduction

The email and url types of the input element ensure that the user has entered a valid e-mail address or fully qualified URL, respectively.

Using the pattern Attribute with the email input Element Type

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
   <head> 
      <title>Example</title> 
   </head> 
   <body> 
      <form method="post" action="http://example.com/form"> 
         <input type="hidden" name="recordID" value="1234"> 
         <p> 
            <label for="name">
                Name: <!--   ww w  . j  a v  a  2  s.  co  m-->
               <input type="text" id="name" name="name" pattern="^.* .*$"> 
            </label> 
         </p> 
         <p> 
            <label for="password">
                Password: 
               <input type="password" placeholder="Min 6 characters" id="password" name="password"> 
            </label> 
         </p> 
         <p> 
            <label for="email">
                Email: 
               <input type="email" placeholder="user@mydomain.com" required pattern=".*@mydomain.com$" id="email" name="email"> 
            </label> 
         </p> 
         <input type="submit" value="Submit"> 
      </form>  
   </body>
</html>

Related Tutorials