HTML and CSS Exercises 2

Question 1

1. In this project, you have a chance to apply some of the data table techniques you learned about in this chapter. As you work through the steps, refer to Figure 10-23 to see the results you will achieve. Save your file and test your work in the browser as you complete each step.

a. Copy the ch10project1.html file from the Chapter 10 folder provided with your Data Files to the Chapter10 folder in your work folder. (Create the Chapter10 folder, if necessary.)

b. Open the file ch10project1.html. This is a blank HTML file with just the necessary structural elements, such as < head>, < body>, and so on.

c. Build a simple table with four columns and five rows as shown. Copy the data shown in Figure 10-23 or use your own.

d. Make sure you include the caption and header row.

e. Display the results in a browser, and then compare them to Figure 10-23.

Figure 10-23: see image.

Question 2

In this project, you continue working in the ch10project1.html flie from the previous exercise. As you work through the steps, refer to Figure 10-24 to see the results you will achieve. Save your file and test your work in the browser as you complete each step.

a. Add the following style properties to the table in ch10project1.html:

• Font family: arial with sans-serif fallback
• Table border: solid 4px blue
• All table borders collapsed
• Table cells border: solid 1px black
• Table cells padding: 10 pixels

b. Display the results in a browser, and then compare them to Figure 10-24.

Figure 10-24: see image.