如果特定类不是元素的子元素,我需要将样式应用于元素。
<table class="printlist" style="width:100%">
<tbody>
<tr class="list_wanted0"><td>Whatever...</td></tr>
<tr class="list_wanted1"><td>
<div class="journal">
<table><tbody>
<tr><td style="width: 9em">2011-03-12 09:36</td></tr>
</tbody></table>
</div>
</td></tr>
</tbody>
</table>
为了演示结构,上面的示例被缩减到最少。
我想要的是 :Hover
属性只适用.printlist tr
如果<tr>
有没有 .journal
child 。
.list_wanted0
和 .list_wanted1
不能用于选择 .journal
, 那里可以是其他类名。
我试过的CSS是:
.printlist tr:Hover * :not(itemjournal) {
color: #000;
background: #aaa
}
显然,这并没有像我预期的那样工作。
如果您需要更多信息,请随时询问,
谢谢。
最佳答案
单独使用 CSS 选择器是不可能的;你不能使用 CSS 来确定一个元素是否有某种子元素。最好的办法是使用 JavaScript 来应用类,并相应地设置这些类的样式。
使用 jQuery-only :has()
selector 的示例:
$('.printlist tr').not(':has(.journal)').addClass('nojournal');
然后将样式应用于 .printlist tr.nojournal:hover
。
关于CSS 样式(如果不是子项),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5284024/