## optgroup

The optgroup element allows you to group a long select list.

Example 3.14 - Form: optgroup in pull-down menus - Example 3.14<p>Select a school:</p><form method="get" action="https://cscie12.dce.harvard.edu/echo" enctype="application/x-www-form-urlencoded"><select name="school"><optgroup label="ACC"><option>Boston College</option><option>Clemson</option><option>Duke</option><option>Florida State</option><option>Georgia Tech</option><option>Louiville</option><option>Miami</option><option>North Carolina</option><option>North Carolina State</option><option>Notre Dame</option><option>Pitt</option><option>Syracuse</option><option>Virginia</option><option>Virginia Tech</option><option>Wake Forest</option></optgroup><optgroup label="Big 10"><option>Illinois</option><option>Indiana</option><option>Iowa</option><option>Maryland</option><option>Michigan</option><option>Michigan State</option><option>Minnesota</option><option>Nebraska</option><option>Northwestern</option><option>Ohio State</option><option>Penn State</option><option>Purdue</option><option>Rutgers</option><option>Wisconsin</option></optgroup><optgroup label="Big XII"><option>Baylor</option><option>Iowa State</option><option>Kansas</option><option>Kansas State</option><option>Oklahoma</option><option>Oklahoma State</option><option>Texas</option><option>Texas Christian</option><option>Texas Tech</option><option>West Virginia</option></optgroup><optgroup label="Ivy League"><option>Brown</option><option>Columbia</option><option>Cornell</option><option>Dartmouth</option><option>Harvard</option><option>Penn </option><option>Princeton</option><option>Yale</option></optgroup><optgroup label="Pac 12"><option>Arizona</option><option>Arizona State</option><option>California</option><option>Colorado</option><option>Oregon</option><option>Oregon State</option><option>Stanford</option><option>UCLA</option><option>USC</option><option>Utah</option><option>Washington</option><option>Washington State</option></optgroup></select><div><input type="submit"/></div></form>

- Markup
- Display
- Screenshot

     <p>Select a school:
     </p>
     <form method="get" action="https://cscie12.dce.harvard.edu/echo">
       <select name="school">
         <optgroup label="ACC">
           <option>Boston College       </option>
           <option>Clemson       </option>
           <option>Duke       </option>
           <option>Florida State       </option>
           <option>Georgia Tech       </option>
           <option>Louiville       </option>
           <option>Miami       </option>
           <option>North Carolina       </option>
           <option>North Carolina State       </option>
           <option>Notre Dame       </option>
           <option>Pitt       </option>
           <option>Syracuse       </option>
           <option>Virginia       </option>
           <option>Virginia Tech       </option>
           <option>Wake Forest       </option>     </optgroup>
         <optgroup label="Big 10">
           <option>Illinois       </option>
           <option>Indiana       </option>
           <option>Iowa       </option>
           <option>Maryland       </option>
           <option>Michigan       </option>
           <option>Michigan State       </option>
           <option>Minnesota       </option>
           <option>Nebraska       </option>
           <option>Northwestern       </option>
           <option>Ohio State       </option>
           <option>Penn State       </option>
           <option>Purdue       </option>
           <option>Rutgers       </option>
           <option>Wisconsin       </option>     </optgroup>
         <optgroup label="Big XII">
           <option>Baylor       </option>
           <option>Iowa State       </option>
           <option>Kansas       </option>
           <option>Kansas State       </option>
           <option>Oklahoma       </option>
           <option>Oklahoma State       </option>
           <option>Texas       </option>
           <option>Texas Christian       </option>
           <option>Texas Tech       </option>
           <option>West Virginia       </option>     </optgroup>
         <optgroup label="Ivy League">
           <option>Brown       </option>
           <option>Columbia       </option>
           <option>Cornell       </option>
           <option>Dartmouth       </option>
           <option>Harvard       </option>
           <option>Penn       </option>
           <option>Princeton       </option>
           <option>Yale       </option>     </optgroup>
         <optgroup label="Pac 12">
           <option>Arizona       </option>
           <option>Arizona State       </option>
           <option>California       </option>
           <option>Colorado       </option>
           <option>Oregon       </option>
           <option>Oregon State       </option>
           <option>Stanford       </option>
           <option>UCLA       </option>
           <option>USC       </option>
           <option>Utah       </option>
           <option>Washington       </option>
           <option>Washington State       </option>     </optgroup>   </select>
       <div>
         <input type="submit"/>

       </div>
     </form>

Select a school: