HTMLで2段のテーブルを作成した時うまく行かない

以下のようなHTMLで、2段まとめたかたまりにスタイルを当てたいのですが、うまくいきません。
どうすれば良いでしょうか。

<table>       
    <tr class="test">
        <tr>
            <td rowspan="2">二段</td>
            <td>1</td>
            <td>2</td>
            <td>3</td>
        </tr>
        <tr>
            <td>4</td>
            <td>5</td>
            <td>6</td>
        </tr>
        <tr>
            <td rowspan="2">二段</td>
            <td>1</td>
            <td>2</td>
            <td>3</td>
        </tr>
        <tr>
            <td>4</td>
            <td>5</td>
            <td>6</td>
        </tr>
    </tr>
</table>

<style>
    .test {
        margin: 10%;
    }
</style>

行動規範の内容に同意します

回答1件

ベストアンサー

trの中にtrタグを置くことはできません

CSS
1<style>
2.test{color:red}
3</style>
4<table>
5    <tbody class="test">
6        <tr>
7            <td rowspan="2">二段</td>
8            <td>1</td>
9            <td>2</td>
10            <td>3</td>
11        </tr>
12        <tr>
13            <td>4</td>
14            <td>5</td>
15            <td>6</td>
16        </tr>
17    </tbody>
18    <tbody>
19        <tr>
20            <td rowspan="2">二段</td>
21            <td>1</td>
22            <td>2</td>
23            <td>3</td>
24        </tr>
25        <tr>
26            <td>4</td>
27            <td>5</td>
28            <td>6</td>
29        </tr>
30    </tbody>
31</table>