css - CSS选择一个id下的几种类型

Question

我想选择 div 下的所有 th 和 td 。写类似：

#div_id th,td {
   ...
}

不好，因为它选择了所有的 td-s。

我在这里看到了解决方案来写

#div_id th,#div_id td { 
   ... 
}

还有其他方法，所以我不应该重复#div_id？

谢谢。

Answer 1

纯 CSS 明智，没有比您自己更好的答案了。但是你可以研究SASS或类似的技术，这将允许这样的事情。

Answer 2

假设您的代码如下所示：

<div id="div_id">
    <table border="1">
        <tr>
            <th>
                Header 1
            </th>
            <th>
                Header 2
            </th>
        </tr>
        <tr>
            <td>
                row 1,
                <p>
                    cell 1
                </p>
            </td>
            <td>
                row 1,
                <p>
                    cell 2
                </p>
            </td>
        </tr>
        <tr>
            <td>
                row 2,
                <p>
                    cell 1
                </p>
            </td>
            <td>
                row 2, 
                <p>
                    cell 2
                </p>
            </td>
        </tr>
    </table>
</div>​​​​​​​​​​​​​​​​​​​​​​

您可以应用如下规则：

#div_id tr > * {
    border: 1px dotted #CCC;
}​

它选择 a 内的第一个元素（并且只有第一个元素）tr，它只能是 ath或td。

请注意，如果我将规则定义为：

#div_id tr * {
    border: 1px dotted #CCC;
}​

标签也将p有一个虚线边框。

但是，简单地键入额外的 8 个字符通常更有意义，因为它更容易理解您稍后做了什么。