Targeting odd even style to specific table with id - css

Question

I have a few tables of which I would only like to target the even and odd rows:
<table class="record">
<tbody>
<tr>
<th scope="col">Score</th>
<th scope="col">Time</th>
</tr>
<tr>
<td>A</td>
<td>1.20</td>
</tr>
<tr>
<td>B</td>
<td>1.35</td>
</tr>
<tr>
<td>C</td>
<td>1.39</td>
</tr>
</tbody>
</table>
I tried to use the following code which I found online, but it works but on all of the tables around the site:
tr:nth-child(even) { background: #666; }
tr:nth-child(odd) { background: #CCC; }
Any suggestions how can I target on tables only with a class of "record" ?
Thank you for your suggestions.
Edit:
And what if this tables is under another table as td? :)

Answer 1

First things first: your question title implies/states that you want to use an id, whereas in your question-code you're using a class, to select the relevant table element. These are not equivalent; an element may have only one id, but multiple classes. That said, to use a class, the posted answer has you covered.
If, on the other hand, you want to use an id (as stated in your title), then replace .record with #idOfTable (and remember to pass an id to your HTML: <table id="idOfTable"><!-- other stuff --></table>).
You can, of course, combine an id with a class selector:
Just pass the ancestor as part of the selector:
.record tr:nth-child(even) {background: #666;}
.record tr:nth-child(odd) {background: #CCC;}
JS Fiddle demo.
On the grounds you may only want this to work within the tbody, you can also pass that as part of the selector:
.record tbody tr:nth-child(even) {background: #666;}
.record tbody tr:nth-child(odd) {background: #CCC;}
JS Fiddle demo.
You can, of course, combine an id with a class selector:
#idOfTable.classNameOfTable {
/* CSS */
}

Answer 2

Just add table.record before the CSS code you posted like so:
table.record tr:nth-child(even) { background: #666; }
table.record tr:nth-child(odd) { background: #CCC; }
The table part is to delimit this only to tables as there might be other elements with the class record and you don't this to interfere with them.
The .record just specifies the class (<elem>.<class> is the syntax and <elem> is not necessary).
And the nesting is simple to understand too: it looks for matching elements within the outer elements. Here is the relevant W3S documentation.