is there a way to exclude a tag from css class

Question

I have css that works on all tr tags for the table.

so in my html I have no styling for tr tag. However, for one TR tag in my table I do not want to apply the TR that is generic to all tables. Is there a way to exclude this TR?

.statisticsTable {
    border:2px solid #990000;
    width:100%;
}
.statisticsTable tr {
    font-weight : bold;
    font-size : 9pt;
    font-family : Arial,Helvetica,sans-serif,Verdana,Geneva;
    color: #ffffff;
    background-color:#990000;

}

<table class="statisticsTable">
   <tr><td colspan="7" class="tableHeaderText">HUB Statistics</td></tr>
   <tr>
      <th colspan="2">HUB</th>
      <th >House Houlds Evaluated</th>
      <th >Total Debt Owed</th>
   </tr>

       <tr  class="<s:if test="#status.even">even</s:if><s:else>odd</s:else>">
           <td  rowspan=3 valign=top>213-65-6425</td>
           <td >All</td>
           <td >t1</td>
           <td >t2</td>

in above the <tr> that has class of either 'even' or 'odd' I do not want this <tr> to have .statisticsTable tr properties. is this possible?

Main think I want to avoid is background-color: #990000; and color: #ffffff;

Answer 1

You have a few options, the easiest I can see in your situation is override the CSS in statisticsTable with further CSS to the style you want in the classes 'even' and 'odd'.

Answer 2

CSS cascades, meaning you can overwrite the values of previously defined properties.

You would do:

.statisticsTable tr.even, .statisticsTable tr.odd {
    font-weight: normal;
    font-size: DEFAULT; /* what ever your default is */
    font-family: DEFAULT; /* what ever your default is */
    /* I would use the font shorthand property */
    color: DEFAULT;
    background: DEFAULT;
}

If you want to use CSS3, you can use :not to only apply the following styles to TR elements which don't have the even or odd class:

.statisticsTable tr:not(.even, .odd) {
    font: bold 9pt Arial,Helvetica,sans-serif,Verdana,Geneva;
    color: #fff;
    background:#990000;
}

Answer 3

In a browser that supports CSS3 pseudo-selectors (this includes most browsers, notably inluding IE7 and IE88 and not IE6), a selector like .statisticsTable tr:not(.even):not(.odd) for that second rule grouping would do what you want.