Метка + вход смежный CSS-селектор не работает

Question

Я могу получить соседний селектор p + p, работающий, но не label + input.Почему это может быть?

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/

Answer 1

Нет, на самом деле это работает, но вы не используете правильное свойство

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

в этом коде вы пытаетесь присвоить background-color: red; checkbox, но не можете дать background-colorна флажок.например, если вы попробуете это:

input {
        background-color: red;
    } 

, это тоже не сработает.

вы используете правильный селектор, но неправильное свойство для флажка, например, попробуйте это.

label+input {
        height:70px;
    } 

теперь высота флажка будет меняться.Я надеюсь, вы поняли мою точку зрения.Пожалуйста, не стесняйтесь спрашивать, если нет.