change an attribute of css

newbie question in css:

I have the following style defined:

TABLE.tabul开发者_如何学运维ardata th {
    font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    background: #CAE8EA url(images/bg_header.jpg) no-repeat;
}

I want to create an identical style but with different background color.

question: is it possible to parameterize the attribute. Background color in this case Or do i need to copy the same style again

---

Like this?

.myclass {
    font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    background: url(images/bg_header.jpg) no-repeat;
}


TABLE.tabulardata th {
    background-color: #CAE8EA;
}

Then just add "myclass" to any element you want to share the attributes..

---

this is not possible with pure css. what you can do is to create 3 styles with classes, one being common two both and then assign them to an element

.font { font-family: Linux Biolinum; }
.red { color:red; }
.blue { color:blue; }

<div class="font red">red</div>
<span class="font blue">blue</span>

---

One way would be:

TABLE.tabulardata th, TABLE.tabulardataOther th {
    font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    background: #CAE8EA url(images/bg_header.jpg) no-repeat;
}

TABLE.tabulardataOther th {
    background: #FFF url(images/other_header.jpg) no-repeat;
}

This works because of CSS precedence. The first line sets tabulardata and tabulardataOther to the same style. Then the second line overrides just the background of tabulardataOther (leaving the other attributes the same).

---

background-color: red