html - 如何根据CSS索引设置DIV的宽度

Question

我在两行中有 6 个 float DIV。我用 PocketGrid作为 CSS 框架(特别是它的“automatic rows”特性)，我想使用 CSS 索引而不是特定的类名来调整每个框架的大小。

我在 this jsFiddle 试过了但即使前 3 个 block (第一行)的大小正确，接下来的 3 个也不正确。

.sintesi-offerta > .block:nth-child(1n) {
  width: 40%;
}

.sintesi-offerta > .block:nth-child(2n) {
  width: 20%;
}

.sintesi-offerta > .block:nth-child(3n) {
  width: 40%;
}

如何设置 .block:nth-child(...) 以获得:

• 第 1 和第 4 个 block ，宽度为 40%
• 第二和第五 block 占 20%(依此类推)

Answer 1

如果我理解正确，你需要做的就是将你的 CSS 更改为以下内容:

.sintesi-offerta > .block:nth-child(3n+1) {
  width: 40%;
}
.sintesi-offerta > .block:nth-child(3n+2) {
  width: 20%;
}
.sintesi-offerta > .block:nth-child(3n+3) {
  width: 40%;
}

旁注:您的 br 标签应该是 <br/>让 jsfiddle 正确解释它们。