Exercise: Design your own form

Fill in whatever you'd like to create your own form. You can remove the reset button if you like, add more fieldsets, or anything else.

Here is a quick review of the controls:

  • For text, use an input elementAn element for a control in a form (types include text, reset, password, checkbox, radio, button and submit). with type attributeAn attribute of an input element specifying what type of control it is (values include text, reset, password, checkbox, radio, button, and submit). text.
  • For a checkbox, use an input element with type attribute checkbox.
  • For a button, use an input element with type attribute button
  • For a set of radio buttons, use input elements with type attribute radio. Each button should have the same value for the name attributeAn attribute of an input element of type radio that is used to assign the same name to all related radio buttons..
  • For a dropdown menu, use a select elementAn element for a dropdown menu in a form. with option elementsAn element for an option in a dropdown menu. inside.

You may wish to use some of these attributes:

  • The placeholder attributeAn attribute of an input element specifying placeholder text. (placeholder) shows the format of what to enter as text (provide a value).
  • The autofocus attributeAn attribute of a form control to specify the focus. (autofocus) sets up a control to be the first one in which to type (no value provided).
  • The checked attributeAn attribute to preset a checkbox in a form to be checked. (checked) presets a checkbox or radio button to be checked (no value provided).
  • The selected attributeAn attribute of an option to specify that it has been selected. (selected) presets a dropdown menu item to be selected (no value provided).
  • The multiple attributeAn attribute of a select element to specify that more than one option can be selected. (multiple) in a select elementAn element for a dropdown menu in a form. allows for more than one option to be selected (no value provided).

Note:

Hints:

  • undefined
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
<!DOCTYPE html>
<html lang="en">
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX