Mengubah Warna Baris Pertama Pada Tabel Dengan CSS

Kita bisa mengubah atau mengganti warna background pada baris pertama saja dari tabel dengan memanfaatkan :first-child selector.

.table-custom tbody tr:first-child {
    background-color: #D4EDDA;
}

<table class="table-custom">
    <thead>
        <tr>
            <th>No</th>
            <th>Nama</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>Irman</td>
        </tr>
        <tr>
            <td>2</td>
            <td>Firmansyah</td>
        </tr>
        <tr>
            <td>3</td>
            <td>Irman Firmansyah</td>
        </tr>
    </tbody>
</table>

:first-child selector akan otomatis mengambil child element pertama dari parent nya, jika di CSS nya tidak di-set parent element nya.

tbody tr:first-child berarti akan mengambil element tr pertama dari parent element tbody.

Jika tidak menggunakan tbody, maka setiap tr pertama yang ditemukan akan ikut di-set warna background nya. Termasuk pada element thead.