[CSS] :nth-child() n번째 부터 n번째 까지

KJA·2022년 8월 9일
0
/* 3, 6, 9, 12 번째(3의배수) */
:nth-child(3n){
  background: red;
}

/* 10번째 부터 이후 */
:nth-child(n+10) {
  color: blue;
}

/* 1번째 부터 5번째 까지 */
:nth-child(-n+5) {
  background: green;
}

/* 15번째 부터 20번째 까지 */
:nth-child(n+15):nth-child(-n+20) {
  background: hotpink;
}

/* 끝에서 부터 3번째 */
:nth-last-child(3) {
  background: gold;
}

/* 홀수 */
:nth-child(odd) { 
  color: red; 
}

/* 짝수 */
:nth-child(even) { 
  color: red; 
}

0개의 댓글