Question

我点亮了这样：

 <ul id="categoria"> <br>
    <li><a href="#">Categoria1</a></li>
    <li><a href="#">Categoria2</a>
        <ul class="sub-menu">
            <li><a href="#">Esercizio1</a></li>
            <li><a href="#">Esercizio2</a></li>
        </ul>
    </li>
    <li><a href="#">Categoria3</a></li>
    <li><a href="#">Categoria4</a>
        <ul class="sub-menu">
            <li><a href="#">Esercizio1</a></li>
            <li><a href="#">Esercizio2</a></li>
        </ul>
    </li>
    <li><a href="#">Categoria5</a></li>
</ul>

我想设置背景颜色，例如红色，但仅适用于列表的子项。所以在这种情况下Esercizio1，Esercizio2，ecc。用jquery。怎么可能这样做？我只知道要为整个清单做。

Answer 1

试试这段代码：

$('.sub-menu li').css('background', 'red');

Answer 2

你可以这样做：

$('element').children().css({'background-color':'red'});

在你的情况下：

$('ul li').children().css({'background-color':'red'});

更详细的版本：

$(".elementClassName li").children().css({'background-color':'red'});

您可以仅指定p标签子项：

$(".elementClassName li").children('p').css({'background-color':'red'});

Answer 3

这有效：的 Demo here

$(".sub-menu li > a").css('background-color','red');

Answer 4

您可以使用此选择器。

$("#categoria li ul li > a").css({backgroundColor: "red" });

或

$(".sub-menu li > a").css({backgroundColor: "red" });

See demo here

您可以了解jQuery selectors here。

这也可以使用CSS实现：

#categoria li ul li > a { background-color: red; }

或

.sub-menu li > a { background-color: red; }

设置儿童背景颜色列表

4 个答案: