html - 仅样式无序列表的第一级

Question

我有一个这样的列表:

    <ul id="main">
        <li>January
            <ul>
                <li>test</li>
                <li>test2</li>
            </ul>
        </li>

        <li>February
            <ul>
                <li>test</li>
                <li>test2</li>
            </ul>
        </li>
    </ul>

我只想影响 li 的第一级 - 我认为这个 css 可以解决问题，但它似乎无法正常工作。

#main > li {
cursor: pointer;
list-style-image: url('plus_sign.gif');
}

子列表旁边仍然有一个加号……我会做错什么？

Answer 1

你可以试试这个 css，它看起来像你想要的。

#main{
    cursor:pointer;
    list-style-image:url('http://www.w3schools.com/cssref/sqpurple.gif');
}
#main ul{
    /*If you don't want the hallow circles*/
    list-style:none;
    /*if you want the hollow cirles, remove list-style and uncomment list-style-image:none
     list-style-image:none;
    */
}

它将仅在一月和二月显示 plus_sign.gif(在本例中为 sqpurple.gif)。参见 Fiddle