1

私はそのようなリストを持っています：

    <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');
}

子リストの横にはまだプラス記号が付いています...何が間違っているのでしょうか？

4

4 に答える 4

1

これは機能するはずです：

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

list-style-imageは継承可能なプロパティであるため、親から値を取得します。

于 2012-11-19T03:19:27.387 に答える
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）は、1月と2月にのみ表示されます。フィドルを参照してください

于 2012-11-19T03:43:49.400 に答える
0

liの他のすべてのケースに対処するための別のルールを追加します。

ul > li{
    color: red;
    /*specifically*/
    list-style-image: none;
}

cssにデフォルトを設定して、特定のケースが例外になるようにします。

于 2012-11-19T03:16:40.377 に答える
0

別のスタイルを作成し、クラスを利用するようにulを変更します。

.main > li {
cursor: pointer;
list-style-image: url('imageurl');
}
.main > li > ul > li {
cursor: auto;
list-style-image: none;
}

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

    <li>February
        <ul>
            <li>test</li>
            <li>test2</li>
        </ul>
    </li>
</ul>
于 2012-11-19T03:49:18.870 に答える