Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS - select th tags only within the tbody of a table

I would like to use a css selector to get only the th tags with the tbody. There are also th tags in the thead section, which I don't want included by the selector. Here's the markup I'm working with. Is there a selector to accomplish this?

<table class="bgtable">
<thead><tr><td width="40%">&nbsp;</td>
<th class="tdplain">Grade 4</th>
<th class="tdplain">Grade 8</th>
<th class="tdplain">Grade 12</th>
</tr>
</thead>
<tbody><tr><th class="tdplain">Civics (2010)</th>
<td class="tdplain">769K</td>
<td class="tdplain">577K</td>
<td class="tdplain">1179K</td>
</tr>
</tbody>
</table>
like image 662
Jeremy Avatar asked Mar 16 '10 14:03

Jeremy


People also ask

How do you select the first th in a table in CSS?

To select the very first <tr> element after a <caption> element, you can instead use: caption + tbody tr:first-child { ... }

Is Tbody tag necessary?

Quoting the HTML 4 spec: "The TBODY start tag is always required except when the table contains only one table body and no table head or foot sections. The TBODY end tag may always be safely omitted."

What is the tbody tag?

The <tbody> tag is used to group the body content in an HTML table. The <tbody> element is used in conjunction with the <thead> and <tfoot> elements to specify each part of a table (body, header, footer). Browsers can use these elements to enable scrolling of the table body independently of the header and footer.

Can you have multiple tbody in a table?

You may use more than one <tbody> per table as long as they are all consecutive.


3 Answers

.bgtable tbody th {
   color: red;
}
like image 185
jessegavin Avatar answered Sep 20 '22 04:09

jessegavin


table.bgtable tbody th {
 /* CSS rules here */
}
like image 43
Matt Ball Avatar answered Sep 21 '22 04:09

Matt Ball


tbody>tr>th {color:red;}
like image 25
dirq Avatar answered Sep 23 '22 04:09

dirq