2

順序付けられていないリストの最初の子であるリスト項目に背景色をレンダリングしようとしています。

HTMLの構造は次のとおりです

<div class="nav-collapse">
    <ul class="nav">
      <li><a href="#">test 1</a></li>
      <li><a href="#">test 2</a></li>
      <li><a href="#">test 3</a></li>
    </ul>
</div>

そして、最初の子要素に背景色を適用しました

.nav-collapse > .nav:first-child {
    background-color: orange;
}

すべてのリスト項目にオレンジ色の背景をレンダリングします。若干のバリエーションでプレイしましたが、違いはありません。

.nav-collapse > ul.nav:first-child
.nav-collapse > ul:first-child

デモはこちら

4

2 に答える 2

4

以下を使用します。

.nav > li:first-child {
    background-color: orange;
}

jsFiddle の作業はこちら

最初のアイテムのスタイルを設定しようとしましたが、.navこれは 1 つしかありません。liの直接の子である最初のスタイルに変更するだけです.nav。

より具体的に使用したい場合：

.nav-collapse > .nav > li:first-child {
    background-color: orange;
}
于 2013-10-07T05:17:44.087 に答える
0

いろいろできるので、これも試してみてください

ul.nav > li:first-child {
    background-color: orange;
}
于 2013-10-07T05:22:28.067 に答える