不同风格的表内表？

Question

如何为两个表格的表格单元格制作两种不同的样式，其中一个单元格在另一个表格中？

我有两种 css 样式：

table.style1 { /* any styles */}
table.style1 td { /* any styles */}

和

table.style2 { /* any styles */}
table.style2 td { /* any styles */ }

在代码中我有这样的感觉：

<table class="style1">
   <tr>
      <td>
         <table class="style2">
            <tr><td>bla bla<td></tr>
         </table>
      </td>
   <tr>
</table>

结果是 - 第二个表格中的所有<td> 表格单元格（带有样式2）都带有样式1...！

当我在表格中有表格时，如何制作两个不同的 css stile？

Answer 1

试试这个代码。我相信它工作正常。

table.style1 { /* any styles */}

table.style1 td { /* any styles */}

和

table.style1 table.style2 { /* any styles */}

table.style1 table.style2 td { /* any styles */}

Answer 2

这是选择不同表格单元格http://jsfiddle.net/HR8Bg/2/的一种方法

.style1 td {
    background: blue;
    color: #fff;
}

.style1 td td {
    background: red;
}

Answer 3

您可以按照以下代码进行操作

表一

table .style1 { /* 任何样式 */}

table .style1 td { /* 任何样式 */}

对于表 2

table .style1 .style2 { /* 任何样式 */}

table .style1 .style2 td { /* 任何样式 */}