CSS3 Selectors: Using first-child to format table header

This entry is part 25 of 40 in the series CSS3 Selectors

It is common for us to use first-child to format the first row or the table header of a html table.

This is done by using selector tr:first-child.

<!DOCTYPE html>
<head lang='en'>
    <meta charset='UTF-8'>
    <title>HTML Table</title>
        tr:first-child {
            background: gray;
            color: white;
<table border='1'>
        <td>Rod Stewart</td>
        <td>Maggie May</td>
        <td>New Order</td>

Series Navigation<< CSS3 Selectors: Structural pseudo-class :first-child
CSS3 Selectors: Last-child >>

Leave a comment

Leave a Reply