How to add a telephone number into a form using HTML5 ?
In this article, we will learn how to insert the telephone number of the user into an HTML Form. We know that phone numbers have so many advantages A Telephone number field is the important component of the form. in case of contact directly with the user. A user can also get various messages or notifications regarding the services of the form.
Approach: Here is the basic simple approach to complete the task. Steps are given below
- Create an HTML document that contains an <input> tag.
- Use the type attribute with the <input> tag which is set to value “tel”.
Syntax
<input type="tel">
Example 1:
HTML
<!DOCTYPE html><html> <head> <title> How to add a Telephone number into a Form using HTML5 </title> <style> #Geek_p { font-size: 30px; color: green; } h1, h2 { font-family: impact; } </style></head> <body style="text-align: center"> <h1 style="color: green">GeeksForGeeks</h1> <h2> How to add a Telephone number into a Form using HTML5 </h2> <form> Name: <input type="text" placeholder="Enter your name here--" /> <br /> Address: <input type="text" placeholder="Enter your permanent Address" /> <br /> Phone No.: <input type="tel" placeholder="Enter phone number" /> <br /> <br /> <button>Submit</button> </form></body> </html> |
Output:
Example 2:
HTML
<!DOCTYPE html><html> <head> <title> How to add a Telephone number into a Form using HTML5 </title> <style> #Geek_p { font-size: 30px; color: green; } h1, h2 { font-family: impact; } </style></head> <body style="text-align: center"> <h1 style="color: green"> GeeksForGeeks </h1> <h2> How to add a Telephone number into a Form using HTML5 </h2> <form> Phone No.: <input type="tel" placeholder="Enter phone number" /> <br /> <br /> <button>Get OTP</button> </form></body> </html> |
Output:
Please Login to comment...