css for table

Here is the HTML for table

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
< html xmlns="http://www.w3.org/1999/xhtml">
< head>
< meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
< title>CSS Tables< /title>
< link href="styles.css" rel="stylesheet" type="text/css" />
< /head>
< body>
< table id="mytable" cellspacing="0" summary="The technical specifications of the Apple PowerMac G5 series">
< caption>Table 1: Power Mac G5 tech specs < /caption>
< tr>
< th scope="col" abbr="Configurations" class="nobg">Configurations< /th>

< th scope="col" abbr="Dual 1.8">Dual 1.8GHz< /th>
< th scope="col" abbr="Dual 2">Dual 2GHz< /th>
< th scope="col" abbr="Dual 2.5">Dual 2.5GHz< /th>
< /tr>
< tr>
< th scope="row" abbr="Model" class="spec">Model< /th>
< td>M9454LL/A< /td>

< td>M9455LL/A< /td>
< td>M9457LL/A< /td>
< /tr>
< tr>
< th scope="row" abbr="G5 Processor" class="specalt">G5 Processor< /th>
< td class="alt">Dual 1.8GHz PowerPC G5< /td>
< td class="alt">Dual 2GHz PowerPC G5< /td>

< td class="alt">Dual 2.5GHz PowerPC G5< /td>
< /tr>
< tr>
< th scope="row" abbr="Frontside bus" class="spec">Frontside bus< /th>
< td>900MHz per processor< /td>
< td>1GHz per processor< /td>
< td>1.25GHz per processor< /td>

< /tr>
< tr>
< th scope="row" abbr="L2 Cache" class="specalt">Level2 Cache< /th>
< td class="alt">512K per processor< /td>
< td class="alt">512K per processor< /td>
< td class="alt">512K per processor< /td>
< /tr>

< /table>

< p>< a href="styles.css">→ download stylesheet< /a>< /p>
< /body>
< /html>

And this is the CSS

body {
 font: normal 11px auto "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
 color: #4f6b72;
 background: #E6EAE9;
}

a {
 color: #c75f3e;
}

#mytable {
 width: 700px;
 padding: 0;
 margin: 0;
}

caption {
 padding: 0 0 5px 0;
 width: 700px; 
 font: italic 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
 text-align: right;
}

th {
 font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
 color: #4f6b72;
 border-right: 1px solid #C1DAD7;
 border-bottom: 1px solid #C1DAD7;
 border-top: 1px solid #C1DAD7;
 letter-spacing: 2px;
 text-transform: uppercase;
 text-align: left;
 padding: 6px 6px 6px 12px;
 background: #CAE8EA url(images/bg_header.jpg) no-repeat;
}

th.nobg {
 border-top: 0;
 border-left: 0;
 border-right: 1px solid #C1DAD7;
 background: none;
}

td {
 border-right: 1px solid #C1DAD7;
 border-bottom: 1px solid #C1DAD7;
 background: #fff;
 padding: 6px 6px 6px 12px;
 color: #4f6b72;
}


td.alt {
 background: #F5FAFA;
 color: #797268;
}

th.spec {
 border-left: 1px solid #C1DAD7;
 border-top: 0;
 background: #fff url(images/bullet1.gif) no-repeat;
 font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
}

th.specalt {
 border-left: 1px solid #C1DAD7;
 border-top: 0;
 background: #f5fafa url(images/bullet2.gif) no-repeat;
 font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
 color: #797268;
}