我想更改标签li ul li
的颜色,但它不会随着给定的html amd css而改变。
HTML
<ul class="s">
<li>
<ul>#1
<li>Hello</li>
<li>Hello</li>
</ul>
<ul>#2
<li>Hello</li>
<li>Hello</li>
</ul>
</li>
</ul>
CSS
.s li ul li{
color:red;
list-style:none;
}
.s li {
list-style:none;
}
.s li ul{
color:green;
}
.s li ul:hover .s li ul li{
color:black;
}
我创建了一个小提琴 here
在悬停时我需要添加或更改什么才能进行颜色更改?
答案 0 :(得分:2)
没有元素匹配.s li ul:hover .s li ul li
最后一条CSS规则应该是
.s li ul:hover li{
color:black;
}
编辑:jQuery的方法需要mouseenter
和mouseleave
事件,但hover
方法涵盖了这两种情况。
$(document).ready(function() {
$( ".s li ul" ).hover(
function() {
$('li', this ).css('color','black' );
}, function() {
$('li', this ).css('color','red' );
});
});
答案 1 :(得分:0)
.s li ul:hover,
.s li ul li:hover {
color:black;
}
您错过,来分隔两个选择器并忘记:悬停。
答案 2 :(得分:0)
像这样更改你的悬停css,你忘了最后一个
.s li ul li:hover{
color:black;
}