时间戳

首页 > 解决方案 > Label + Input Adjacent CSS Selector not working

css - Label + Input Adjacent CSS Selector not working

问题描述

I can get a p+p adjacent selector working, but not label + input. Why could this be?

p+p {
  color: red;
  /* Works fine! */
}

label+input {
    background-color: red;
  /* Doesn't work */
}
<p>Test</p>
<p>Test</p>
<br>
<label>Test</label><input type='checkbox'>

https://jsfiddle.net/h16engzw/

标签： csscss-selectors

解决方案

不，实际上它正在工作，但您没有使用正确的属性

label+input {
    background-color: red;
  /* Doesn't work */
}

在此代码中，您试图给予background-color: red;acheckbox但不能给予background-color复选框。例如，如果您尝试这样做：

input {
        background-color: red;
    }

这也行不通。

您正在使用正确的选择器，但复选框的属性错误，例如试试这个。

label+input {
        height:70px;
    }

现在复选框的高度会改变。我希望你明白我的意思。如果没有，请随时询问。

推荐阅读