Three most common control used in web page is
All of the controls have their own unique style.
The Basic format of email is somename@servername.com, here ".com"may replaced by ".net", ".in" or ".something else". But in this case if we write somename@servername, then HTML cannot find any error.
URL Generally have one dot in middle and end with different domain name like
And so on. Here a user must input the http://something.something then HTML cannot find any error.
A phone number is just a no. It has no alphabet. General contact no in India have is a 10 digit no.
These controls are not used for data validation. For data validation we will have to use the regular expression.These three controls are similar to the normal textbox. But if we use the wrong format for the URL and email then only browser shows an error message (when we click on the submit button). But if the user uses the touch screen and iPhone 4 (iOS 4.2) and HTC Desire (Android 2.2) the different keyboard appears on selection of different controls.
Here is how the code looks like.
<!DOCTYPE html>
<html> <head> <title>Contact No, Email, Website Demo</title> </head>
<body>
<form name="f1">
Contact No<input id="phone" type="tel" />
<input type="submit" />
</form>
<form name="f2">
Email<input id="email" type="email"/>
<input type="submit" />
</form>
<form name="f3">
Website<input id="website" type="url"/>
<input type="submit" />
</form>
</body>
</html>