Home >> FAQs/Tutorials >> XHTML Tutorials and Tips >> Index

XHTML Tutorial - Drop Down List "select" Tag/Element

By: FYIcenter.com

(Continued from previous topic...)

What Is a "select" Tag/Element?

A "select" element is an inline element that you can use to define a dropdown input field in a form. Here are basic rules about a "select" element:

  • "select" elements are inline elements.
  • "select" elements can only be used as sub-elements of "form" elements.
  • A "select" element can not have empty content.
  • A "select" element can not have text content.
  • A "select" element can have one or more "option" elements as its sub-elements.
  • A "select" element will be displayed by browsers as a dropdown list with "option" sub-elements displayed as options in the list.

Here is a tutorial example of dropdown list fields:

<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
 <head>
  <title>Dropdown List</title>
 </head>
 <body>
  <h4>Online Survey</h4>
  <form action="http://localhost/submit" method="get">
  <p style="background-color: #eeeeee; padding: 8px;">
   Your name: <input type="text" name="name"
    value="Joe"/><br/>
   How did you find FYIcenter:
    <select name="channel">
     <option>Google search</option>
     <option>Yahoo search</option>
     <option>Your friend</option>
    </select><br/>
   <input type="submit" value="Submit"/> 
  </p>
  </form>
 </body>
</html>

If you save the above document as dropdown_list.html, and view it with Internet Explorer, you will see a dropdown list in the form as shown below:
            Dropdown List

(Continued on next topic...)

  1. What Is a "form" Tag/Element?
  2. What Are the Attributes of a "form" Element?
  3. What Is an "input" Tag/Element?
  4. How Many Input Types Are Supported by "input" Elements?
  5. How To Use "text" Input Fields?
  6. How To Use "password" Input Fields?
  7. How To Use "checkbox" Input Fields?
  8. What Are the Values Submitted on Checkbox Fields?
  9. How To Use "radio" Input Fields?
  10. What Are the Values Submitted on Radio Button Fields?
  11. How To Use "submit" Input/Action Fields?
  12. What Are the Values Submitted on Submit Button Fields?
  13. How To Use "reset" Input/Action Fields?
  14. How To Use "file" Input Fields?
  15. How To Use "hidden" Input Fields?
  16. How To Use "image" Input Fields?
  17. What Are the Values Submitted on Image Button Fields?
  18. How To Use "button" Input Fields?
  19. What Is a "textarea" Tag/Element?
  20. What Are the Attributes of a "textarea" Element?
  21. What Is a "select" Tag/Element?
  22. What Is an "option" Tag/Element?
  23. What Is a "label" Tag/Element?
  24. Can Two Forms Be Nested?
  25. Do Broswers Support Multiple Forms?


Selected Developer Jobs:

More...