nth-childのネガティブ指定

nth-childはリスト構造など、同じ要素が多く連なる場合、5番目の要素に指定したり3の倍数の要素に、
cssの指定をしたりなど、多くの場面で活用できる擬似要素です。

実は、nth-childにはネガティブな値も指定できます。

  
テキスト
  
テキスト
  
テキスト
  
テキスト
  
テキスト
  
テキスト

 
#sample li:nth-child(-n+5) {
  color:green;
}

上記では、最初から5番目の要素までフォントの色が緑になります。