CSSでネストされたリストをZebraでストライピングする

疑似クラス:nth-child(odd/even)を使用して背景とリストと行をスタイルするのは簡単ですが、ネストされたリストに適用しようとすると恐ろしく見えます。CSSでネストされたリストをZebraでストライピングする

私の質問は、例えば、親の色が子供の要素と無限に交互になる深さ/階層で交互に変わる方法があるかどうかです。例えば：

2012-03-26 Greg

短い回答、いいえ。長い答え、ネストされたアイテムをターゲットにして、はい：

li:nth-child(odd) {background:blue} 
li:nth-child(odd) li:nth-child(even) {background:blue} 
li:nth-child(even) li:nth-child(odd) {background:blue}

しかし、2,3レベルを超えると、おそらく多くのルールが必要になります。

また、ツリーを歩いてカウンターを増やしたり、カウンターが奇数か偶数かのときにスタイルを適用したりすることで、javascriptでも実行できます。

2012-03-26 06:35:17 SpliFF

ああああ、js方法が簡単だろう。 if（color == "green"）{color = red; } else {color = green; }完了。 – user1289347

Bummer。ありがとう！ – Greg

2012-03-26 06:34:37 user1289347

最初の子は親と同じ色にできますので、私が念頭に置いたものではありません。http://jsfiddle.net/aqTwZ/ – Greg

はい、レイヤーを追加したためです。 SpliFFのように、すべてのレイヤーにルールを追加する必要があります。しかし、ねえ、私はあなたが私に仕事を与えた例を作った。 – user1289347

ええ、申し訳ありません。この例ではいくつかのレベルを深めていますが、jsfiddleで保存するのを忘れてしまったと思います。とにかくありがとう。 – Greg

答えて