Source code
Revision control
Copy as Markdown
Other Tools
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Blueprint Forms Tests</title>
<!-- Framework CSS -->
<link
rel="stylesheet"
href="screen.css"
type="text/css"
media="screen, projection"
/>
<link rel="stylesheet" href="print.css" type="text/css" media="print" />
<!--[if IE
]><link
rel="stylesheet"
href="ie.css"
type="text/css"
media="screen, projection"
/><![endif]-->
</head>
<body>
<div class="container showgrid">
<h1>Forms</h1>
<hr />
<div class="span-12">
<form id="dummy" action="" method="post">
<fieldset>
<legend>Simple sample form</legend>
<p>
<label for="dummy0">Text input (title)</label><br />
<input
type="text"
class="title"
name="dummy0"
id="dummy0"
value="Field with class .title"
/>
</p>
<p>
<label for="dummy1">Another field</label><br />
<input
type="text"
class="text"
id="dummy1"
name="dummy1"
value="Field with class .text"
/>
</p>
<p>
<label for="dummy2">Textarea</label><br />
<textarea name="dummy2" id="dummy2" rows="5" cols="20"></textarea>
</p>
<p>
<input type="submit" value="Submit" />
<input type="reset" value="Reset" />
</p>
</fieldset>
</form>
</div>
<div class="span-12 last">
<div class="error">
This is a <div> with the class <strong>.error</strong>.
<a href="#">Link</a>.
</div>
<div class="notice">
This is a <div> with the class <strong>.notice</strong>.
<a href="#">Link</a>.
</div>
<div class="success">
This is a <div> with the class <strong>.success</strong>.
<a href="#">Link</a>.
</div>
<fieldset>
<legend>Select, checkboxes, lists</legend>
<p>
<label for="dummy3">Select field</label><br />
<select id="dummy3" name="dummy3">
<option value="1">Ottawa</option>
<option value="2">Calgary</option>
<option value="3">Moosejaw</option>
</select>
</p>
<p>
<label for="dummy4">Select with groups</label><br />
<select id="dummy4" name="dummy4">
<option>Favorite pet</option>
<optgroup label="mammals">
<option>dog</option>
<option>cat</option>
<option>rabbit</option>
<option>horse</option>
</optgroup>
<optgroup label="reptiles">
<option>iguana</option>
<option>snake</option>
</optgroup>
</select>
</p>
<p>
<label>Radio buttons</label><br />
<input type="radio" name="example" /> Radio one<br />
<input type="radio" name="example" /> Radio two<br />
<input type="radio" name="example" /> Radio three<br />
</p>
<p>
<label>Checkboxes</label><br />
<input type="checkbox" /> Check one<br />
<input type="checkbox" /> Check two<br />
<input type="checkbox" /> Check three<br />
</p>
</fieldset>
</div>
<hr />
<p>
<img
src="valid.png"
alt="Valid HTML 4.01 Strict"
height="31"
width="88"
class="top"
/></a>
</p>
</div>
</body>
</html>