HTML table row background color

Introduction

In an HTML table, we can use bgcolor attribute to specify a background color for a table or particular cell. So, in this article, we will discuss how to specify HTML table row background color.

How to add bg-color

<table border="1px" bgcolor="skyblue" cellpadding="5px">
<tr>
<th>Heading 1</th>
<th>Heading 2</th>
</tr>
<tr>
<td>Row 1 col 1</td>
<td>Row 1 col 2</td>
</tr>
</tr>
<tr>
<td>Row 2 col 1</td>
<td>Row 2 col 2</td>
</tr>
</table>

Output:

In the above HTML code, we have a table with three rows and two columns. The first row has two table heading tags. The table tag has an bgcolor attribute and value as sky blue, So the background color will display on the whole table.

Add bg-color to row

<table>
<tr bgcolor="red">
<th>Heading 1</th>
<th>Heading 2</th>
</tr>
<tr>
<td>Row 2 col 1</td>
<td>Row 2 col 2</td>
</tr>
</table>

Output:

Here we have two table row tags with in the <table> tag. In the first <tr> tag we use the “bgcolor” attribute, So the background color will be displayed in the first row only.

Conclusion

We can use the “bgcolor” attribute to <table> or <tr> or <th> tag also.