styleless order form : form : Form Style HTML CSS TUTORIALS


HTML CSS TUTORIALS » Form Style » form »

 

styleless order form


 


<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  <title></title>
  <style type="text/css" media="print">
  .fillout {
   color: black;
   border-width: 0;
   border-bottom: 1px solid #000;
   width: 300pt;

  .postselect {
   display: block;
   width: 300pt;
   height: 1em;
   border: none;
   border-bottom: 1px solid #000;
  }
  </style>

</head>

<body>
<form>

<h2>Order Form</h2>

  <table cellspacing="0">

    <tr> 
      <td width="116"><label for="fname">First Name<label>:</td>
      <td><input class="fillout" name="fname" type="text" id="fname" /></td>
    </tr>
    <tr> 
      <td>Last Name:</td>
      <td><input class="fillout" name="lname" type="text" id="lname" /></td>
    </tr>
    <tr> 
      <td>Email:</td>
      <td><input class="fillout" name="email" type="text" id="email" /></td>
    </tr>
    <tr> 
      <td>Address:</td>
      <td><input class="fillout" name="address1" type="text" id="address1" /> </td>
    </tr>
    <tr> 
      <td>&nbsp;</td>
      <td><input class="fillout" name="address2" type="text" id="address2" /></td>
    </tr>
    <tr> 
      <td>City:</td>
      <td><input class="fillout" name="city" type="text" id="city" /></td>
    </tr>
    <tr> 
      <td>State/Province:</td>
      <td> <select name="state" size="1">
          <option selected="selected">Select</option>
          <option>Alabama </option>
          <option>Alaska </option>
          <option>Arizona </option>
          <option>Arkansas </option>
          <option>California </option>
          <option>Colorado </option>
          <option>Connecticut </option>
          <option>Delaware </option>
          <option>Florida </option>
          <option>Georgia </option>
          <option>Hawaii </option>
          <option>Idaho </option>
          <option>Illinois </option>
          <option>Indiana </option>
          <option>Iowa </option>
          <option>Kansas </option>
          <option>Kentucky </option>
          <option>Louisiana </option>
          <option>Maine </option>
          <option>Maryland </option>
          <option>Massachusetts </option>
          <option>Michigan </option>
          <option>Minnesota </option>
          <option>Mississippi </option>
          <option>Missouri </option>
          <option>Montana </option>
          <option>Nebraska </option>
          <option>Nevada </option>
          <option>New Hampshire </option>
          <option>New Jersey </option>
          <option>New Mexico </option>
          <option>New York </option>
          <option>North Carolina </option>
          <option>North Dakota </option>
          <option>Ohio </option>
          <option>Oklahoma </option>
          <option>Oregon </option>
          <option>Pennsylvania </option>
          <option>Rhode Island </option>
          <option>South Carolina </option>
          <option>South Dakota </option>
          <option>Tennessee </option>
          <option>Texas </option>
          <option>Utah </option>
          <option>Vermont </option>
          <option>Virginia </option>
          <option>Washington </option>
          <option>Washington, D.C. </option>
          <option>West Virginia </option>
          <option>Wisconsin </option>
          <option>Wyoming </option>
          <option>---------- </option>
          <option>Alberta </option>
          <option>British Columbia </option>
          <option>Manitoba </option>
          <option>New Brunswick </option>
          <option>New Foundland </option>
          <option>Nova Scotia </option>
          <option>Northwest Territories </option>
          <option>Ontario </option>
          <option>Prince Edward Island </option>
          <option>Quebec </option>
          <option>Saskatchewan </option>
          <option>Yukon Territory </option>
          <option>Other </option>
        </select><span class="postselect"> </span>
      </td>
    </tr>
    <tr> 
      <td>Zip Code:</td>
      <td><input class="fillout" name="zip" type="text" id="zip" /></td>
    </tr>
    <tr> 
      <td>Daytime Phone:</td>
      <td><input class="fillout" name="dayphone" type="text" id="dayphone" /></td>
    </tr>
    <tr> 
      <td>Product(s):</td>
      <td><input name="product" type="checkbox" id="product" value="ezweb" />Web ($19.95
         <input name="product" type="checkbox" id="product" value="ezwebultra" />Ping ($29.95)</td>
    </tr>
    <tr> 
      <td>Type of Credit Card:</td>
      <td><input type="radio" name="cc" value="mastercard" />
        Mastercard 
        <input type="radio" name="cc" value="visa" />
        Visa
        <input type="radio" name="cc" value="discover" />
        Discover</td>
    </tr>
    <tr> 
      <td>Name on Credit Card:</td>
      <td><input class="fillout"  name="ccname" type="text" id="ccname" /></td>
    </tr>
    <tr> 
      <td>Card Number:</td>
      <td><input class="fillout"  name="ccnumber" type="text" id="ccnumber" /></td>
    </tr>
    <tr> 
      <td>Card Expiration Date:</td>
      <td><input class="fillout"  name="ccnumber" type="text" id="ccnumber" /></td>
    </tr>
  </table>
<input type="submit" name="Submit" value="Submit" id="submit" />
</form>

</body>
</html>

 



HTML code for linking to this page:

Follow Navioo On Twitter

HTML CSS TUTORIALS

 Navioo Form Style
» form