Chapter 14. Styling a Data Table

This lesson is divided into two sections. First, you will learn how to add accessibility features to a data table to make the content more accessible for screen readers. Second, you will learn how to style various elements within the table.

Starting with a Basic Table

As CSS increases in popularity, there is a growing trend to move away from using tables to mark up content. However, there are times when tables are the best markup option, especially for tabular data. A basic data table is shown in Listing 14.1.

Example 14.1. HTML Code Containing the Markup for a Data Table

<table> <tr> <td>Item</td> <td>Threaded screws </td> <td>Flat nails</td> <td>Dyna-bolts </td> <td>Spring washers</td> </tr> <tr> <td>1 kg</td> <td>$2.50</td> ...

Get Sams Teach Yourself CSS in 10 Minutes now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.