E-mail List Subscription Form

<form method="post" action="form-example-sub-label.php">

  <!--
      Text box input form controls with LABEL markup using the FOR and ID attributes
   -->
  <p class="text" ><label for="first">First Name</label><input type="text" name="first" id="first" size="20" value=""/></p>
  <p class="text" ><label for="last">Last Name</label><input type="text" name="last" id="last" size="30" value=""/></p>

  <!--
      Checkbox input form control with LABEL markup using the FOR and ID attributes
   -->
  <p class="check" ><input type="checkbox" name="check1" id="check1"/><label for="check1">Remove from E-mail list</label></p>

  <!--
      More text box input form controls with LABEL markup using the FOR and ID attributes
   -->
  <p class="text" ><label for="email1">E-mail Address</label><input type="text" name="email1" id="email1" size="40" value=""/></p>
  <p class="text" ><label for="email2">Confirm E-mail</label><input type="text" name="email2" id="email2" size="40" value=""/></p>

  <!--
      Select form control with LABEL markup using the FOR and ID attributes
   -->
  <p class="select">
     <label for="select1">Subscription Type</label>
     <select name="select1" id="select1">
      <option value="0" selected="selected">Regular</option>
      <option value="1">Digest (Traditional) </option>
      <option value="2">Digest (MIME format)</option>
      <option value="3">Digest (HTML format)</option>
      <option value="4">Index (traditional)</option>
      <option value="5">Index (HTML format)</option>
    </select>
  </p>

  <!--
      Radio button form controls with LABEL markup using the FOR and ID attributes.  The FIELDSET and LEGEND elements are used to give the group of form controls a label.
   -->
  <fieldset class="radio">
    <legend>Acknowledgement of posting</legend>
    <ul class="radio">
      <li><input type="radio" name="radio1" id="radio10" value="0" checked="checked"/><label for="radio10">No acknowledgements</label></li>
      <li><input type="radio" name="radio1" id="radio11" value="1"/><label for="radio11">Short message confirming receipt</label></li>
      <li><input type="radio" name="radio1" id="radio12" value="2"/><label for="radio12">Receive copy of own postings</label></li>
    </ul>
  </fieldset>

  <!--
      Setting the TABINDEX attribute to "0" is used to make sure screen reader users can easily find the instructions for filling out the next part of the form.  NOTE: The tabindex technique results in invalid HTML, so the tabindex attribute should be added through scripting.
   -->
<p class="instruction" tabindex="0">If you would like to have access to the private archive you will need to create a password.  Your e-mail address will be used as your login id.</p>
  <!--
      Password form controls with LABEL markup using the FOR and ID attributes
   -->
  <p class="text" ><label for="pass1">Password</label><input type="password" name="pass1" id="pass1" size="20" value=""/></p>
  <p class="text" ><label for="pass2">Confirm Password</label><input type="password" name="pass2" id="pass2" size="20" value=""/></p>

  <!--
      Textarea form control with LABEL markup using the FOR and ID attributes
   -->
  <p class="text" ><label for="textarea1">Note to list administrator</label><textarea name="textarea1" id="textarea1" rows="10" cols="80"></textarea></p>
  <p class="submit"><input type="submit" value="Submit Request"/></p>
</form>

/* html test pages styles */


table.examples thead {
   background-color: #F8F8F8;
}

table.examples th.desc {
   font-weight: normal;
   text-align: left;
}

table.examples td {
   text-align: center;
}


table.examples th.res {
   font-weight: normal;
   text-align: center;
}

table.examples tr.b {
  background-color: #DDFFDD;
}

table.examples tr.b th.res{
  color: #228B22;
}

table.examples tr.f {
  background-color: #FFDDDD;
}

table.examples tr.f th.res {
  color: #FF0000;
}

table.examples tr.p {
  background-color: #F0E68C;
}

table.examples tr.p th.res {
  color: #904000;
}

table.htmlbp tr.e {
  background-image: url('../images/exp.png');
}

table.htmlbp tr.e th.res{
  color: black;
}