Question

我无法弄清楚为什么我无法选择直接子表的行（假设其他子表包含在主表的TD中，我只是想要直接子行，而不是后代表行。）

这里是彻底简化后的剩余结构（另见jsfiddle here）：

<body>
    <table>
        <tr>
            <td>TR 1 - TD 1 </td>
            <td>TR 1 - TD 2 </td>
        </tr>
        <tr>
            <td>TR 2 - TD 1</td>
            <td>
                <table>
                    <tr>
                        <td>Table 2 - A </td>
                        <td>Table 2 - B </td>
                    </tr>
                    <tr>
                        <td>Table 2 - C</td>
                        <td>Table 2 - D</td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</body>

我无法选择主表的直接子节目行：
- <body> <table> <tr> <td>TR 1 - TD 1 </td> <td>TR 1 - TD 2 </td> </tr> <tr> <td>TR 2 - TD 1</td> <td> <table> <tr> <td>Table 2 - A </td> <td>Table 2 - B </td> </tr> <tr> <td>Table 2 - C</td> <td>Table 2 - D</td> </tr> </table> </td> </tr> </table> </body>逻辑上选择表和子表的所有行 - body>table tr {background-color:lightgray;}逻辑上仅选择子表的所有行 - 但 body>table tr tr {color:blue;} 根本不会选择任何内容（不会看到红色文字）

我做错了什么？在结构上？在选择器上？
->jsfiddle

Answer 1

当tbody元素不在标记中时可能会自动插入（副作用是table > tr选择器可能失败），因此请尝试使用body > table > tbody tr更改上一条规则。

示例：http://jsfiddle.net/wn84hotm/2/

CSS子选择器：不能选择直接子表的行，不包括子表的子表

1 个答案: