HTML and CSS Reference
In-Depth Information
Perform the following tasks:
1. Add HTML code to align the table on the left of the Web page. Give the table a border of 1 with
padding of 15 pixels. Add a heading spanning six columns in color #4174ab.
2. Insert the image parasailing.jpg in to a new table header cell that spans five rows. Determine the
width and height of the image using methods discussed in the chapter.
3. Create an external style sheet that contains the following styles and save it as stylesextend4-1.css.
Validate the CSS code.
4. Link stylesextend4-1.css into the Web page extend4-1solution.html.
table {text-align: center;}
.twentyfive {width: 25%;}
.twelve {width: 12%;}
th.blue {background-color: #4174ab;
color: white;}
td.instructors {font-weight: bold;
text-align: left;
color: white;
background-color: #4174ab;}
5. Add the class, twentyfive, to the first two columns (image and instructors). Add the classes, twelve and
blue, in the next four columns (days of week). (Hint: Separate multiple class names with a comma.)
6. Add the class, instructors, to the table cells that contain the instructor names.
7. Save the revised document as extend4-1solution.html and validate the code using the W3C
validator service.
8. Resave extend4-1solution.html. Print the revised HTML file and Web page and submit them in
the format specified by your instructor.
Make It Right
Analyze a document and correct all errors and/or improve the design.
Correcting the Golf Course Tournament Schedule
Instructions:
Start your browser. Open the file makeitright4-1.html from the Chapter04\MakeItRight
folder of the Data Files for Students. See the inside back cover of this topic for instructions on
downloading the Data Files for Students, or contact your instructor for information about accessing
the required files. The Web page is a modified version of what you see in Figure 4-46 on the next page.
Make the necessary corrections to the Web page to make it look like Figure 4-46, using inline styles for
all styles. The Web page should include the six columns of information with a main heading that spans
all six columns. The second row contains the image golfcourse.png in the first cell. The second row also
has a line break between the person's first and last name. (
Hint:
Use the <br /> tag.) Move the caption
to the bottom in italics. Make every other row of the table color #9ecc39. Save the file as makeitright4-
1solution.html and validate the code. Submit the files in the format requested by your instructor.
Continued >
