为第一个孩子申请CSS~ combinator

Question

我在父母中有两个项目，只有当第二个/其他孩子存在时才需要将CSS应用于第一个孩子。 〜那样做，只买第一个孩子的兄弟姐妹，反之亦然。

tldr：将<label>设为红色，前面没有<div>，但之后

div ~ label {
  color: red;
}

https://jsfiddle.net/q836Lev1/1/

div ~ label {
  color: red;
}

<fieldset>
  <div></div>
  <label>this label is red</label>
  <div>works, but not good, there must be no first div.</div>
</fieldset>

<fieldset>
  <label>this label is red</label>
  <div>doesn't work, label should be red and div comes after.</div>
</fieldset>

Answer 1

您可以使用label:nth-last-child(2)：

＆＃13;

＆＃13;

label:nth-last-child(2) {
  color: red;
}

＆＃13;

<fieldset>
  <div></div>
  <label>this label is red</label>
  <div>works, but not good, there must be no first div.</div>
</fieldset>

<fieldset>
  <label>this label is red</label>
  <div>doesn't work, label should be red and div comes after.</div>
</fieldset>

＆＃13;

＆＃13;

＆＃13;