Checkboxes and radio buttons
More input element types.
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Checkbox and radio inputs</title>
<style>
body {
font: 100% arial, helvetica, sans-serif;
}
fieldset {
padding: 0 1em 1em 1em;
}
legend {
padding: 1em;
}
label {
float: left;
width: 6em;
}
</style>
</head>
<body>
<form action="someplace.php">
<fieldset>
<legend>Films you like</legend>
<div>
<label for="drama">Drama</label>
<input type="checkbox" name="drama" id="drama" value="drama">
</div>
<div>
<label for="action">Action</label>
<input type="checkbox" name="action" id="action" value="action">
</div>
<div>
<label for="comedy">Comedy</label>
<input type="checkbox" name="comedy" id="comedy" value="comedy">
</div>
<div>
<label for="horror">Horror</label>
<input type="checkbox" name="horror" id="horror" value="horror">
</div>
<div>
<label for="scifi">Sci-fi</label>
<input type="checkbox" name="scifi" id="scifi" value="scifi">
</div>
</fieldset>
<fieldset>
<legend>Your age</legend>
<div>
<label for="lt20">19 or under</label>
<input type="radio" name="age" id="lt20" value="lt20">
</div>
<div>
<label for="20to39">20 to 39</label>
<input type="radio" name="age" id="20to39" value="20to39">
</div>
<div>
<label for="40to59">40 to 59</label>
<input type="radio" name="age" id="40to59" value="40to59">
</div>
<div>
<label for="gt59">60 or over</label>
<input type="radio" name="age" id="gt59" value="gt59">
</div>
</fieldset>
</form>
<!-- Link back to HTML Dog: -->
<p><a href="http://www.htmldog.com/examples/"><img src="http://www.htmldog.com/badge1.gif" alt="HTML Dog"></a></p>
</body>
</html>