Question

我在两个table中有两个div，每个div都有一个不同的类。我想将padding仅应用于其中一个表格的单元格。

（以下代码也在JSFiddle）

HTML部分：

<div class=tight>
<table>
<tr>
  <td>hello</td><td>world</td>
</tr>
</table>
</div>

<div class=wide>
<table>
<tr>
  <td>bonjour</td><td>tout le monde</td>
</tr>
</table>
</div>

CSS部分：

td {
  background: green;
  color: white;
  padding: 10px;
}

这会将padding应用于所有单元格。

的各种组合我试图具体化

td .wide { ... }
td, .wide { ... }
td.wide { ... }

但我找不到合适的人。

是否可以为元素设置属性，但是哪个是特定div的子级（具体=具有特定类）？

Answer 1

例如，如果要在＆lt;上应用填充td＆gt;第一个div，使用：

.tight td{
  padding: 10px;
}

如果您希望排除其中一个类，也可以使用：

div:not(.tight) td {
  padding: 10px;
}

Answer 2

使用像.wide td

这样的东西

如何将属性的属性应用于div继承的类？

2 个答案: