css - さまざまなスタイルのテーブル内のテーブル？

Question

それらの1つのセルが別のテーブル内にある2つのテーブルテーブルセルに対して2つの異なるスタイルを作成するにはどうすればよいですか？

私は2つのCSSスタイルを持っています：

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

と

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

コードでは、私はこのようなsomtingを持っています：

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

結果は次のように<td>なります-2番目のテーブル（style2を使用）のすべてのテーブルセルはstyle1を使用しています...！

テーブルの中にテーブルがある場合、2つの異なるcssスタイルを作成するにはどうすればよいですか？

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

さまざまなテーブル セルを選択する 1 つの方法を次に示しますhttp://jsfiddle.net/HR8Bg/2/

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

.style1 td td {
    background: red;
}

Answer 3

以下のコードに従うことができます

表 1 の場合

table .style1 { /* 任意のスタイル */}

table .style1 td { /* 任意のスタイル */}

表 2 の場合

table .style1 .style2 { /* 任意のスタイル */}

table .style1 .style2 td { /* 任意のスタイル */}