Skip to content

Instantly share code, notes, and snippets.

@yardfarmer

yardfarmer/form.html

Created September 21, 2014 12:46
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save yardfarmer/b17280233176875db5b2 to your computer and use it in GitHub Desktop.
Save yardfarmer/b17280233176875db5b2 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
form.html
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type"/>
<meta name='viewport' content='width=device-width, initial-scale=1.0'
<title>HTML5 Form</title>
</head>
<body>
<div id="bin"></div>
<form>
<label for='name'>Name <em>*</em></label>
<input id='name' placeholder='codinglion' autofocus><br>
<label for='telephone'>Telephone</label>
<input type='tel' id='telephone' placeholder='xxx-xxx-xxxxx'><br>
<label for='promoCode'>Promotion Code</label>
<input id='promoCode' placeholder='ABC-142' title='xxxxxxx xx'
pattern="[a-zA-Z]{3}-[0-9]{3}"></br>
<label for='mail'>mail</label>
<input type='email' id='email' placeholder='xxx-xxx-xxxxx'><br>
<label for='url'>url</label>
<input type='url' id='url' placeholder='xxx-xxx-xxxxx'><br>
<label for='number'>number</label>
<input type='number' id='number' placeholder='xxx-xxx-xxxxx'><br>
<label for='search'>search</label>
<input type='search' id='search' placeholder='xxx-xxx-xxxxx'><br>
<label for='number'>number</label>
<input type='number' min='0' max='100' id='number' step='1'> <br>
<label for='range'>range</label>
<input type='range' id='range' min='1' max='100'><br>
<label for='date'>date</label>
<input type='date' id='date' min='1900-01-01' max='2200-01-01'>
<datalist>
<option label='labelA' value='vA'>
<option label='labelB' value='vB'>
</datalist>
</form>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment