リスト表示の条件設定
奇数番目の要素にだけ適用
li:nth-child(odd){
偶数番目の要素にだけ適用
li:nth-child(even){
最初の要素にだけ適用
li:first-child{
最後の要素にだけ適用
li:last-child{
上からn番目の要素にだけ適用
li:nth-child(3){
この場合上から3番目の要素にだけ適用される。数字を変えればその場所の要素だけ適用される。
上からnつの要素だけに適用
li:nth-child(-n+3) {
この場合上から3つの要素にだけ適用される。「-n」にすることに注意。
上からn番目以降の要素にだけ適用
li:nth-child(n+4) {
この場合4番目以降の要素にだけ適用される。
下からn番目の要素にだけ適用
li:nth-last-child(3){
この場合上から3番目の要素にだけ適用される。
下からnつの要素にだけ適用
li:nth-last-child(-n+3) {
この場合下から3つ目の要素にだけ適用される。「-n」にすることに注意。
下からn番目以前の要素にだけ適用
li:nth-last-child(n+4) {
この場合下から4つ目以前の要素にだけ適用される。
Xの倍数番目の要素にだけ適用
li:nth-child(3n) {
この場合3の倍数番目(3、6、9、12…)の要素にだけ適用される。
li:nth-child(3n+1) {
このようにすると3の倍数に1を足した数番目(1、4、7、10…。)の要素にだけ適用される