orbit-basic/public/demo/form_1.html

89 lines
2.2 KiB
HTML

<link rel="stylesheet" href="../stylesheets/easy.css" media="screen" />
<style>
/* COPY START HERE */
.form fieldset{border:none;margin:0;padding:0;}
.form legend{display:none;}
.form div{clear:both;margin:.5em 0;}
.form label{
float:left;
width:150px;
}
.form .field, .form .area{
width:250px;
padding:3px;
}
.form select{padding:3px;width:256px;}
.form .submit{margin-left:150px;}
/* COPY END HERE */
</style>
<div id="container">
<div class="main">
<!-- COPY START HERE -->
<form action="/" method="post" class="form">
<fieldset><legend>Contact form</legend>
<div>
<label for="firstname">First Name</label>
<input type="text" name="firstname" id="firstname" size="30" class="field required" />
</div>
<div>
<label for="lastname">Last Name</label>
<input type="text" name="lastname" id="lastname" size="30" class="field" />
</div>
<div>
<label for="address">Address</label>
<input type="text" name="address" id="address" size="30" class="field" />
</div>
<div>
<label for="url">URL</label>
<input type="text" name="url" id="url" size="30" class="field required url" />
</div>
<div>
<label for="email">Email</label>
<input type="text" name="email" id="email" size="30" class="field required email" />
</div>
<div>
<label for="phonenumber">Phone Number</label>
<input type="text" name="phonenumber" id="phonenumber" size="30" class="field" />
</div>
<div>
<label for="city">City</label>
<select name="city" id="city" class="select">
<option>New York</option>
<option>London</option>
<option>Paris</option>
<option>Tokio</option>
<option>Sydney</option>
</select>
</div>
<div>
<label for="country">Country</label>
<select name="country" class="select">
<option>USA</option>
<option>UK</option>
<option>France</option>
<option>Japan</option>
<option>Australia</option>
</select>
</div>
<div>
<label for="message">Message</label>
<textarea name="message" id="message" cols="30" rows="10" class="area"></textarea>
</div>
<div class="submit"><button type="submit">Submit</button></div>
</fieldset>
</form>
<!-- COPY END HERE -->
</div>
</div>