Practicing HTML Table and Form Concepts
In this two-part exercise, you will
begin with the index.html file in the Mod4-Act1 folder and the index.html file
in the Mod4-Act2 folder and add several additional pieces of content and
styles.
Activity I
Step 1. For Part I of this activity,
open
the index.html file in the Mod4-Act1
folder in Sublime Text by either using the File menu > Open File command in
the program or by dragging the file from the folder window into the blank
Sublime Text window.
Step 2. Construct a table that is seven
cells across and six cells tall
and that
displays a CBS primetime TV listing from several years ago (as seen at right).
This table should appear just after the second headline on the page.
|
Alt Text table information
|
|
|
8:00
|
8:30
|
9:00
|
9:30
|
10:00
|
10:30
|
|
Mon
|
Big
Bang Theory
|
How I Met
Your
Mother
|
Two
and A Half Men
|
Rules of
Engagement
|
CSI:
Miami
|
|
Tue
|
NCIS
|
The
Mentalist
|
Without
a Trace
|
|
Wed
|
New Adventures
of Old
Christine
|
Gary
Unmarried
|
Criminal
Minds
|
CSI:
New York
|
|
Thu
|
Survivor
|
|
CSI:
Crime Scene
Investigation
|
Eleventh
Hour
|
|
Fri
|
Ghost Whisperer
|
Flashpoint
|
Numbe3rs
|
Step
3. Proof your work as you
progress in a blank browser tab or window, and then again a final time before
submitting your assignment. Your finished work should look like the figure
at right. Ensure you save your work to the folder before continuing.
|
This image presents a formatted web page with the SNHU jpg
image on the left and the following
table information embedded in the page as follows.
|
|
|
8:00
|
8:30
|
9:00
|
9:30
|
10:00
|
10:30
|
|
Mon
|
Big
Bang Theory
|
How I Met
Your
Mother
|
Two
and A Half Men
|
Rules of
Engagement
|
CSI:
Miami
|
|
Tue
|
NCIS
|
The
Mentalist
|
Without
a Trace
|
|
Wed
|
New
Adventures of Old
Christine
|
Gary
Unmarried
|
Criminal
Minds
|
CSI:
New York
|
|
Thu
|
Survivor
|
|
CSI:
Crime Scene
Investigation
|
Eleventh
Hour
|
|
Fri
|
Ghost Whisperer
|
Flashpoint
|
Numbe3rs
|
Activity II
Step 1. For Part II of this
Activity, open the index.html file in
the Mod-4-Act2
folder in Sublime Text by either using the File menu > Open File command in
the program or by dragging the file from the folder window into the blank
Sublime Text window.
Step 2. Construct a form entitled
“Keeping In Touch” that has three text fields to start—Full name, Email
address, and Phone number—and a set of three radio buttons under the heading
“How Often Do You
Want to Hear from
Us?” whose three radio button options are Daily Email, Weekly Email, and Monthly
Email. Finally, include a Submit button for this form. This form should appear
just after the second headline on the page.
Step 3. Proof your work as you progress
in a blank browser tab or window, and then again, a final time before
submitting your assignment. Ensure you save your work to the folder before continuing.
Your finished work should look like this:
|
This image presents a formatted web page with the SNHU jpg
image on the left and the following
table information embedded in
the page as follows.
|
|
Keeping
in
Touch
|
|
|
Full
Name
|
[Blank
Field Space]
|
|
Email
Address
|
[Blank
Field Space]
|
|
Phone
Number
|
[Blank
Field Space]
|
|
How
Often Do you Want to Hear From Us?
|
|
Check
field
Selected
|
Daily
Email
|
|
Check
field
not
selected
|
Weekly
Email
|
|
Check
field
not
selected
|
Monthly
Email
|
|
Submit
Button
|
Step 5. When you have
completed the assignment according to the requirements outlined above, please
zip up the complete “Mod4” subfolder in which you have been working this
exercise.
Looking for a Similar Assignment? Order now and Get 10% Discount! Use Coupon Code "Newclient"