CSS3で定義された:nth-child()疑似クラスは、ある要素の隣接している子要素を最初から数えて、n番目にあたる要素にスタイルを適用します。
尚、n番目というのは隣接している要素を全て数えるので、間に別の要素が有るとその要素もカウントしてn番目にスタイルが適用されます。

この疑似クラスは、偶数と奇数で指定を変えしましまにするとか、何番目だけ指定を変えるといった事ができます。

対応ブラウザ

• 
• 
• 
• 
• 
• 
• 

:nth-child()疑似クラスのサンプル

ol li:nth-child(2n) {
  color: green;
}

ol li:nth-child(5) {
  color: purple;
  font-weight: bold;
}

<ol>
<li>テキスト</li>
<li>テキスト</li>
<li>テキスト</li>
<li>テキスト</li>
<li>テキスト</li>
<li>テキスト</li>
<li>テキスト</li>
<li>テキスト</li>
</ol>

これで偶数行だけスタイルが適用されるので、しましまとかに使えます。
この指定は、:nth-child(even)と書いても同じです。
また、nの値を正整数で具体的に指定すると、そこだけだけ別のスタイルが適用されるので、このサンプルでは5番目のli要素だけ別のスタイルが適用されます。

このサンプルを今見ているブラウザで表示すると以下のようになります。

サンプルのブラウザ上の表示

1. テキスト
2. テキスト
3. テキスト
4. テキスト
5. テキスト
6. テキスト
7. テキスト
8. テキスト

このサンプルでは偶数行に対して指定していましたが、奇数行に指定したい場合は:nth-child(2n+1)もしくは:nth-child(odd)とする事で適用させる事ができます。

次のサンプルでは、1～3番目の指定が繰り返して表示されます。

p:nth-child(3n+1) {
  background: #f5dada;
}

p:nth-child(3n+2) {
  background: #ddf5da;
}

p:nth-child(3n+3) {
  background: #dae0f5;
}

<p>テキスト</p>
<p>テキスト</p>
<p>テキスト</p>
<p>テキスト</p>
<p>テキスト</p>
<p>テキスト</p>
<p>テキスト</p>
<p>テキスト</p>

<h4>見出し</h4>

<p>テキスト</p>
<p>テキスト</p>
<p>テキスト</p>

これで、きっとカラフルな感じに見えます。

このサンプルを今見ているブラウザで表示すると以下のようになります。

サンプルのブラウザ上の表示

テキスト

テキスト

テキスト

テキスト

テキスト

テキスト

テキスト

見出し

テキスト

テキスト

テキスト

テキスト

隣接していないといけないので、h4要素が途中にあるとh4要素以降からまた1として数え直しているのが確認できます。
兄弟関係全ての要素をカウントしているので、途中にあるh4要素も数えてスタイルが適用されます。

続いて、もう少し細かい仕様についてご説明しておきます。
例えば、以下のように書いた場合は、全て同じ扱いになります。

p:nth-child(1n+0) {}

p:nth-child(n+0) {}

p:nth-child(n) {}

p {}

タイプセレクタと同じになりますが、タイプセレクタとは個別性が変わってきます。具体的には、タイプセレクタが「1」に対して他は「11」になります。

また、この(n)のn部分には半角スペースなどの空白類文字が入れれますが、入れれる場所が決まっています。
では、まずはOKのサンプルから。

:nth-child( 3n + 1 ) {}

:nth-child( +3n - 2 ) {}

:nth-child( -n+ 6) {}

:nth-child( +6 ) {}

こんな感じで、(の後や)の前、an + bなどの場合の+の前後に入れるのはOKです。
続いて、ダメなサンプルを。

:nth-child(3 n) {}

:nth-child(+ 2n) {}

:nth-child(+ 2) {}

anとならなければならない場合や、bのみなのに+と離れてしまったりするのはダメだったりします。
この辺り、不安な場合は空白類文字を入れないのが良いかと思います。