将CSS类分配给完整但不是其中一个标记

Question

我在表<tr>标签上有一个css类但我想阻止它被添加到一个<td>

这可能吗？我可以为特定<td>添加单独的课程以停止添加<tr>的课程吗？

Answer 1

您可以使用:not选择器（您可以使用它来过滤括号内的选择器的所有栏）：

＆＃13;

＆＃13;

table td:not(.this) {
  background: red;
  color: blue;
}

＆＃13;

<table>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
  </tr>
  <tr>
    <td>1</td>
    <td class="this">2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
  </tr>
</table>

＆＃13;

＆＃13;

＆＃13;

---

或者，如果你想以不同的方式设置它（而不是根本不设置），你可以使用类选择器：

＆＃13;

＆＃13;

table tr {
  background: red;
  color: blue;
}
.this {
  background: green;
  color: white;
}

＆＃13;

<table>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
  </tr>
  <tr>
    <td>1</td>
    <td class="this">2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
  </tr>
</table>

＆＃13;

＆＃13;

＆＃13;

Answer 2

tr.MyClassName{
    // styling goes here
}

这应仅设置tr的样式，而不是td。