如何将CSS应用于特定表格的td？

Question

如何将CSS应用于一个特定表格的td，而排除网页中的所有其他表格？

<table class="pure-table fullWidth" id="ToBeApplied">
 <tbody>
  <tr class="pure-table-odd">
   <td>
    <label>Bank</label>
   </td>
   <td>
    <label>Japha Bank</label>
   </td>
  </tr>
 </tbody>
</table>
<table class="pure-table fullWidth" id="NotToBeApplied">
 <tbody>
  <tr class="pure-table-odd">
   <td>
    <label>Bank</label>
   </td>
   <td>
    <label>Japha Bank</label>
   </td>
  </tr>
 </tbody>
</table>

我想应用CSS来实现

td {padding:23px;font-weight:bold}

• 我希望将其应用在ID为“ToBeApplied”的表格的td上。
• 我不想写一个类并在每个表格的td上都写同样的内容。
• 我不想将其应用于第二个ID为“NotToBeApplied”的表格的td。

如何修改HTML和CSS以实现以上要求？

- fatherazrael

---

对于位于id='ToBeApplied'中的td，应用#ToBeApplied td{padding:23px;font-weight:bold}。 - Hearner

如果你写 td { }，它将适用于所有的 td。如果你写 #ToBeApplied td，它将适用于具有 id=ToBeApplied 的表格中的所有 td。 - Hearner

Answer 1

使用 CSS 选择器，例如：

#ToBeApplied td {padding:23px;font-weight:bold}

- sanjeev shetty

Answer 2

这应该可以正常工作（假设您不想为表格指定id）。

table.pure-table:first-child td {padding:23px;font-weight:bold}

DEMO

- Sowmya

Answer 3

This is what you want.

查看这个fiddle。

#ToBeApplied td {
    padding:23px;
    font-weight:bold
}

这里是代码片段。

#ToBeApplied td {
  padding: 23px;
  font-weight: bold
}

<table class="pure-table fullWidth" id="ToBeApplied">
  <tbody>
    <tr class="pure-table-odd">
      <td>
        <label>Bank</label>
      </td>
      <td>
        <label>Japha Bank</label>
      </td>
    </tr>
  </tbody>
</table>
<table class="pure-table fullWidth" id="NotToBeApplied">
  <tbody>
    <tr class="pure-table-odd">
      <td>
        <label>Bank</label>
      </td>
      <td>
        <label>Japha Bank</label>
      </td>
    </tr>
  </tbody>
</table>

- Shrinivas Shukla

Answer 4

只需在下面添加样式：

<style type="text/css">
    #ToBeApplied tr td{padding:23px;font-weight:bold}
</style>

可以使用父级在样式之前限制CSS应用。

希望这能帮助您实现所需的目标！

- MarmiK