css - リスト内の 2 つおきの div の CSS スタイル設定

Question

私divのウェブサイトにボックスがあります。2 つおきのボックスには別の色の境界線が必要です。

1 つのケースではdiv、 がリストとして表示されます。HTML コードは自動生成されるため変更できません。私のウェブサイトの他の部分では、次のようなスタイリングを行い、機能します。

.displayBlogpost:nth-child(2n+1) {
    border: #B4C556 1px solid;
}

しかし、olそれはもう機能しません。every second にアクセスする方法がわかりません.displayBlogpost-div。これは私のコードです: http://jsfiddle.net/8SbbL/

Answer 1

n番目の子を使用するには、それをリストアイテムに適用する必要があります。

http://jsfiddle.net/8SbbL/6/

あなたも使用することができnth-child(even)、nth-child(odd)あなたよりも読みやすい2n-1

Answer 2

要素はli内にあるため、常に最初と最後の要素です。実際のliでn番目の子トリックを使用します。

#searchresult li:nth-child(2n+1) .displayBlogpost {
    border: #B4C556 1px solid;
}

ワーキングフォーク： http： //jsfiddle.net/FJuzm/