下一个元素的CSS选择器？

好奇，如果我做错过什么，或者它真的是不可能的选择下一个label以下HTML块：下一个元素的CSS选择器？

<div class="col-md-1"> 
    <input type="radio" name="name" value="alice" id="name-alice"> 
</div> 
<label for="name-alice">Alice</label> 
<div class="col-md-1"> 
    <input type="radio" name="name" value="bob" id="name-bob"> 
</div> 
<label for="name-bob">Bob</label>

我想选择标签检查输入，像

input:checked + label { 
    background-color: red; 
}

在这里，+ CSS selector显然不起作用。任何想法如何解决这个问题？

理由：一般可以认为是“父母选择的问题”，但输入&标签要素是特异性的，因为与for和id属性进行配对和目前还不清楚是否有在CSS一些对口。里面的div

来源

2015-08-15 joanbm

可以将标记改变。使用当前的HTML，您不能根据“输入”选择“标签”。 – Harry

也考虑使用jQuery，如果你对它很灵活。 –

@哈里为什么不呢？ 'for'属性通过''id''将'label'分配给'input'＃ – joanbm

移动标签：

<div class="col-md-1"> 
    <input type="radio" name="name" value="bob" id="name-bob"> 
    <label for="name-bob">Bob</label> 
</div>

来源

2015-08-15 08:19:47 deniskoronets

谢谢，但这不是正确的解决方案，因为只有'输入'需要由'col-md-1'类来格式化，而不是'label'。 – joanbm

@JoanBlackmoore这是唯一没有诉诸JS的解决方案。简而言之，CSS没有父选择器。如果标签的格式如此重要，难道你不能仅仅给标签指定一个类并且反对'.col-md-1'强加的样式？ – zer00ne

答案upvoted。 – joanbm

下一个元素的CSS选择器？

回答

相关问题