HTML and CSS Reference
In-Depth Information
Test your
knowledge of
CSS to create
a Web table
listing room
at a popular
Case Problem 4
Data Files needed for this Case Problem: hcclogo.jpg, modernizr-1.5.js, rooms.txt
Hamilton Conference Center Yancy Inwe is the facilities manager at the Hamilton
Conference Center in Hamilton, Ohio. The conference center, a general-use facility
for the community, hosts several organizations and clubs as well as special events and
shows by local vendors. The center recently upgraded its intranet capabilities, and Yancy
would like to create a Web site where employees and guests can easily track which
conference rooms are available and which are being used. She would like this informa-
tion displayed in a Web table that lays out the room use for seven rooms and halls from
8:00 a.m. to 5:00 p.m. in half-hour increments. Eventually, this process will be auto-
mated by the conference's Web server; but for now, she has come to you for help in set-
ting up a sample Web page layout and design.
Complete the following:
1. Use your text editor to create an HTML fi le named conference.htm and two style
sheets named hcc.css and schedule.css . Enter your name and the date in a comment
section of each fi le. Include any other comments you think aptly document the pur-
pose and content of the fi les. Save the fi les in the tutorial.05\case4 folder.
2. Use the text fi les provided to create a Web page containing the reservation informa-
tion. The design of the Web page is up to you, and you may supplement your Web
page with any material you feel is appropriate. Place the styles for the page layout in
the hcc.css style sheet.
3. Create a table containing the room reservation information. The table structure
should contain the following elements:
• a table caption and summary
• table row and column groups
• examples of row- and/or column-spanning cells
• examples of both table heading and table data cells
4. Create a style for your table in the schedule.css style sheet. The layout and appear-
ance of the table are up to you, but the table should include the following:
• a border style applied to one or more table objects
• a style that defi nes whether the table borders are separate or collapsed
• styles applied to table rows and column groups
• use of horizontal and vertical alignment of the table cell contents
• different widths applied to different table columns
• styles applied to the table caption
5. Document your style choices with appropriate comments.
6. Add a columnar layout to one section of your document. The number of columns
and its appearance are up to you.
7. Submit your completed fi les to your instructor, in either printed or electronic form,
as requested.
Search WWH ::

Custom Search