CSS在一个ID下选择几种类型

Question

我想选择div下的所有th和td。 写是这样的：因为它选择所有的TD-

#div_id th,td { 
    ... 
} 

不好。

我看到的解决方案here写

#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; 
}​ 

，其选择中的第一个元素（也是唯一的第一个元素）一个tr，这只能是th或td。

注意，如果我有，而不是定义的规则为：

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

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

但是，只需输入多余的8个字符通常会更有意义，因为它更容易理解后来做了什么。