Question

非常抱歉，我知道这是一个非常基本的问题。

代码工作正常，除非我尝试将属性应用于另一个对象（在这种情况下为标签）。类“ c”。我不明白为什么这样的基本问题不起作用。

HTML：

 <button type="button" id="boton" disabled>hi</button>
    <input type="checkbox" id="checky"/>
    <label class="c" id="checkyl" for="checky">etiquette</label>

Css：

#boton:disabled:hover + .c {
   font-weight: bold;
}

Answer 1

您可能正在寻找通用的同级选择器~

#boton:disabled:hover~.c {
  font-weight: bold;
}

<button type="button" id="boton" disabled>hi</button>
<input type="checkbox" id="checky" />
<label class="c" id="checkyl" for="checky">etiquette</label>

在这种情况下，相邻的同级选择器+将不起作用，因为.c不在#boton之后直接出现

Answer 2

.c1 + .c2 {
  /* styles here  */
}

上面的选择器选择c2类的元素，该元素紧随.c1类的元素

.c1 ~ .c2 {
  /* styles here  */
}

此选择器选择c2类的元素，如果c.1类的元素是同级的

在这种情况下，您需要使用同级（〜）选择器而不是相邻同级（+）选择器

#boton:disabled:hover~.c {
  font-weight: bold;
}

当我添加复选框标签的类时，CSS停止工作

2 个答案: