HTML and CSS Reference
In-Depth Information
In the Lab
Lab 3: Creating Schedules
Problem:
You want to create a Web page and an external style sheet that lists your piano practice and
volunteer schedule, similar to the one shown in Figure 4-49. The Web page will use a table with images
that span several rows and columns to organize the information.
Instructions:
Perform the following steps:
1. Start a new HTML file with the title Lab 4-3 in the main heading section.
2. In the Web page, create a bordered table that displays in 90% of the browser, as shown in
Figure 4-49.
3. Insert an inline style into the <table> tag that assigns the border a color of #194a70, a border width
of 20 pixels, and a border style of groove. Give the table a rounded-edge look by using the border-
radius property (see Appendix D). The radius should be 25 pixels.
4. Include the headings and data cells as shown, with valid information (i.e., real days and times as
per a normal schedule of activities) in the data cells. The main headings (Piano Practice Schedule
and Kid Camp Schedule) should be center-aligned across three columns and have a line height of
30 pixels. The data, other than the main headings, will have an indent of 10 pixels when the style
sheet is coded and attached.
each title
spans
three
columns
each
image
spans
five rows
lab4-3styles.css
external style
sheet sets styles
for Web page
row background
and text colors vary
Figure 4-49
