tr:first-child : Pseudo Class « Style Basics « HTML / CSS






tr:first-child

  

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en'>
    <head>
        <title>:first-child</title>
<style type='text/css'>
body {
    font-size: 12px sans-serif;
}
table {
    background: slateblue;
    color: #fff;
    width: 100%;
    border-collapse: collapse;
    border: 1px solid mediumslateblue;
}
td {
    border: 1px solid darkslateblue;
    padding: 2px;
}
th {
    background: lightsteelblue;
    color: darkslateblue;
    font-size: 18px;
    text-align: left;
}
table tbody tr:first-child td {
    background: mediumslateblue;
}
</style>
    </head>
    <body>
        <h1>Discography</h1>
        <table>
            <thead>
                <tr>
                    <th>Album</th>
                    <th>Year</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>A</td>
                    <td>March 1963</td>
                </tr>
                <tr>
                    <td>B</td>
                    <td>November 1963</td>
                </tr>
                <tr>
                    <td>C</td>
                    <td>July 1964</td>
                </tr>
                <tr>
                    <td>D</td>
                    <td>December 1964</td>
                </tr>
            </tbody>
        </table>
    </body>
</html>

   
    
  








Related examples in the same category

1.The first-child Structural Pseudo-Class
2.Dynamic Pseudo-Class Selectors
3.first-letter and :first-line Pseudo-Elements
4.Dynamic pseudo-classes
5.Structural pseudo-classes
6.:target pseudo-class
7.h1::before, h1::after content: "::";
8.The first-child pseudo-class
9.Using the first-letter pseudo-element to create a "drop cap" letter
10.Link Pseudo-Class Example
11.:before and :after Pseudo-elements
12.Use Pseudo-Classes
13.First-letter Pseudo-element
14.Creating a drop cap using a CSS pseudo-element
15.First Line and Letter
16.p:first-line{font-weight:bold;}
17.first-letter {font-size:42px; width:200px;}
18.Set style for a:link and a:visited