我想申请styles到parent它是否有child元素。
styles
parent
child
到目前为止,我已经将样式应用于child元素(如果存在)。但我想style的parent,如果parent有child,仅使用CSS。
style
CSS
以下是 html
html
<ul class="main"> <li>aaaa</li> <li>aaaa</li> <li>aaaa</li> <li>aaaa</li> <li>aaaa <ul class="sub"> <li>bbbb</li> <li>bbbb <ul> <li>cccc</li> <li>cccc</li> <li>cccc</li> </ul> </li> <li>bbbb</li> <li>bbbb</li> <li>bbbb</li> </ul> </li> <li>aaaa</li> <li>aaaa</li> <li>aaaa</li> </ul>
该css代码
css
* { margin:0; padding:0; text-decoration:none; } .main li { display:inline-block; background:yellow; color:green; } .main > li > ul > li { background:orange } .main > li > ul > li > ul >li { background:pink; }
CSS3不可能。有一个建议的CSS4选择器,$可以做到这一点,它看起来像这样(选择li元素):
$
li
ul $li ul.sub { ... }
作为替代方案,使用jQuery,您可以利用的单行代码是这样的:
$('ul li:has(ul.sub)').addClass('has_sub');
然后,您可以继续li.has_sub在CSS中设置样式。
li.has_sub