Lesson 3: Applying Styles to Data Tables


In the previous two lessons you have learned how to use CSS to stylize HTML documents. Practically any HTML element can be stylized. In this example, you will continue to practice applying CSS, by stylizing the various elements of the data table you created in an earlier lesson.

Learner Outcomes

At the completion of this exercise:


  1. Open the file table.htm, which you created in the earlier exercise on Creating a Data Table.
  2. Review your table's source code. At a minimum, it should include the following HTML elements:


  3. If you haven't already done so, add a <style></style> section to the top of the web page.
  4. Add style declaractions for each of the above HTML elements. Try applying different styles, colors, borders, backgrounds, etc. Be creative, but try to maintain a professional look.
  5. Each time you apply a new style, save the page and view it in your browser.

Handouts/Online Documents

All done?

Show your instructor your results before starting the next module.