html - 提供表格 CSS 类

Question

我正在尝试使用自定义 CSS 制作表格，但我不知道自己做错了什么。以前做过这个，但由于某种原因我无法让该死的 CSS 显示出来......只显示一个没有样式的空白表格。

CSS:

table.300yardsTable{background:#EEE;color:#333;font-size:14px;text-align:center;}
table.300yardsTableHeader tr{background:#CCC;font-weight:bold;}
table.300yardsRow tr{background:#EEE;color:#333;}
table.300yardsRow:hover tr{background:#242424;color:#CCC;}

表格:

<table width="600" border="1" align="center" cellpadding="2" cellspacing="2" class="300yardsTable">
<tr class="300yardsTableHeader">
    <td width="25%">LOFT</td>
    <td width="25%">HAND</td>
    <td width="25%">LIE</td>
    <td width="25%">VOLUME</td>
</tr>
<tr class="300yardsRow">
    <td>8*-12*</td>
    <td>RH/LH</td>
    <td>61*</td>
    <td>460cc</td>
</tr>
</table>

Answer 1

您的 css 错误，类在 tr 上而不是在表上。

tr.yardsTableHeader tr{background:#CCC;font-weight:bold;}
tr.yardsRow {background:#EEE;color:#333;}
tr.yardsRow:hover{background:#242424;color:#CCC;}

去掉类名中的#