<分区>
<分区>
我正在尝试完全用 CSS 完成一些事情。
<body>
<div class="box">
<div>Text</div>
<div>Text</div>
<div>Text</div>
</div>
<div class="box">
<div>Text</div>
<div class="selected">Text</div>
<div>Text</div>
</div>
<div class="box">
<div>Text</div>
<div>Text</div>
<div>Text</div>
</div>
</body>
fiddle :http://jsfiddle.net/c4bmuxze/4/
我想让“选定”的所有 DIV 都变成绿色。你如何做到这一点?您如何返回到父选择器(例如“.box”),选择所有后续兄弟(通过“~”)然后向下选择它们的 DIV?
如果所有的 DIV 都是直接 sibling ,这根本就不是问题,只是在 parent 之间跳转这一步让我很难做到这一点。
我希望有 CSS 大师或有人向我指出显而易见的事情。
最佳答案
使用 CSS 不可能,但您可以借助 jQuery 来选择父对象。
$('.selected').parent().addClass('contains-selected');
.selected {
color: red;
}
.limegreen {
color: limegreen;
}
.selected ~ div {
color: limegreen;
}
.contains-selected.box ~ div {
color: limegreen;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<div class="box">
<div>Text</div>
<div>Text</div>
<div>Text</div>
</div>
<div class="box">
<div>Text</div>
<div class="selected">Text</div>
<div>Text</div>
</div>
<div class="box">
<div>Text</div>
<div>Text</div>
<div>Text</div>
</div>
<div class="box">
<div>Added Text</div>
<div>Added Text</div>
<div>Added Text</div>
</div>
</body>
关于html - 从父选择器中选择 sibling ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32967192/