Ok, this is pretty basic stuff. But I have created an example for you.
In this simple demo we have 2 tables, we only want to style the first one. We give it a class
or id
and using that give the table styles. Its the same as anything else really, as the table has the class test
we don't need to try and get the table again e.g: .test table
as we are already selecting it.
From this the first table with the class test
will be styled, whereas the second will not be touched due to it not having class test
.
Have a look at the fiddle and play around with it, hope this helps.
HTML:
Only this one will be affected
<table class="test">
<tr>
<th>Test</th>
<th>Test</th>
<th>Test</th>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
This table will not
<table>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
CSS:
.test th {
width: 100px;
border: 1px solid;
font-size: 10px;
}
.test td {
border: 1px solid;
height: 100px;
}