Change specific table background - html

Question

In the CSS, I have
table {
max-width:100%;
background-color:transparent;
border-collapse:collapse;
border-spacing:0
}
In HTML, I have
<table class="table">
<tr>
<td>
<img width="90px" src="logo.png">
</td>
<td>
<div class="page-header">Header
<td>
</tr>
</table>
How do I change the background color of the second <td> without changing the other table's <td> in CSS file?
Mind you, I'm using Bootstrap as my base CSS. And it's kinda complicated when it comes to modifying the code.

Answer 1

Using CSS you can something like
table tr:first-child td:nth-child(2){
background:red;
}

Answer 2

Add a class to your desired <td> element.
In that class, specify for desired background
See here for a working example

Answer 3

Add a class to the td you want to change (for example, use 'headerTd'):
<table class="table">
<tr>
<td><img width="90px" src="logo.png"></td>
<td class="headerTd"><div class="page-header">Header<td>
</tr>
</table>
Then add the following rule to your css:
.headerTd{
background-color:red;
}

Answer 4

You can go for styling only the 2nd simply give the style attribute.
style="color:red"

Answer 5

.secondTD {
background:red;
}
<table class="table">
<tr>
<td><img width="90px" src="logo.png"></td>
<td class="secondTD"><div class="page-header">Header<td>
</tr>
</table>
But if you want without classes, then
table:tr:td {
background:red;
}
<table class="table">
<tr>
<td><img width="90px" src="logo.png"></td>
<td><div class="page-header">Header<td>
</tr>
</table>
in case when every row with first td:
table>tr:td {
background:red;
}