有没有办法选择一个不是子元素的元素?我不太确定如何措辞或解释它。希望代码会说明一切:
fiddle :http://jsfiddle.net/kBhgV/3/
HTML:
<div title="section-1">
<div>
<input type="checkbox" id="item-1">
<label for="item-1">Item 1</label>
</input>
</div>
</div>
<div title="section-2">
<div>Test Drop</div>
</div>
CSS:
[title=section-2] {
display: none;
}
input:checked ~ [title=section-2] {
display: block;
}
有没有一种方法可以在您选中该框时显示 section-2 而不会使 section-2 成为 section 1 的子项?
最佳答案
更改您的代码
<div title="section-1">
<div>
<input type="checkbox" id="item-1">
<label for="item-1">Item 1</label>
</input>
</div>
</div>
<div title="section-2">
<div>Test Drop</div>
</div>
到
<input type="checkbox" id="item-1"/>
<div title="section-1">
<div>
<label for="item-1">Item 1</label>
</div>
</div>
<div title="section-2">
<div>Test Drop</div>
</div>
那么您的 CSS 应该可以正常工作。您可以将复选框的可见性设置为隐藏,并将其绝对放置在页面之外的某个位置。
我的站点使用了类似的导航技术,因此您可以通过检查代码了解它是如何工作的。
改变了你的 fiddle
关于css - 有没有办法选择一个不是子元素的元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21945978/