Exercise 5: FORMS
In this exercise we will design one web page that uses a form to collect data.
HTML Elements
The opening form element needs the following three attributes to make it work.
Close the form element at the very end of your form
- <form> </form>
- action="url"
- method="post"
- enctype="text/plain"
We will work with 5 types of INPUT tags. The first three each use the name [the topic of the question] and value [the answer value] attributes to show what answers were chosen on the form.
Use the next two types, submit & reset, to create your closing buttons.
The input tag does not use a closing tag
- <input> No closing tag
- type="text"
- type="radio"
- type="checkbox"
- type="submit"
- type="reset"
- name="question topic"
- value="answer"
Use the SELECT element to create dropdown or scrolling menus.
To create the dropdown menu, just use the name attribute. To create the scrolling menu, use both the name and size attributes.
The OPTION elements are nested between the opening and closing select tag to create the options to choose from
- <select> </select>
- name="question topic"
- size="#"
- <option> </option>
- value="answer"
Use the TEXTAREA Element to create comment boxes. You must use the name attribute for the textarea box to work correctly.
Use the rows and cols attributes to set the initial size of your comment box
- <textarea> </textarea>
- rows="x"
- cols="x"
- id="x"
- name="name"
Exercise Requirements
- Read the lecture on BlackBoard or email
- Read Chapter 9 [pages 147-174] in the book
- Review the Demo pages
- Watch the Videos as needed
- Create a project folder named "Ex5"
- Create One HTML page
- Use all the different kinds of form input types in one form.
- Make up your own creative content.
- Add a background image and other images as needed
- Use CSS for styling
- Use your real email address so the form comes to you when I grade it