CSS 선택기를 사용하여 테이블의 특정 열 범위를 대상으로 지정하는 방법은 무엇입니까?

특정 열 범위에 대한 CSS 선택기

이 질문은 CSS 선택기를 적용하여 특정 열 범위에 적용해야 하는 필요성에 대해 설명합니다. 테이블. 원래 선택기인 .myTableRow td:nth-child(?)는 테이블 행에서의 위치를 ​​기반으로 특정 하위 요소를 대상으로 합니다. 그러나 질문은 선택기를 2~4열에 적용하는 방법을 모색합니다.

답변에서 제안한 것처럼 한 가지 접근 방식은 다음 선택기를 사용하는 것입니다.

<code class="css">.myTableRow td:nth-child(n+2):nth-child(-n+4) {
  background-color: #FFFFCC;
}</code>

이 선택기는 대상을 지정합니다. myTableRow 클래스가 있는 행 내에서 두 번째 자식 이상 및 최대 네 번째 자식인 모든 테이블 셀(td)입니다. 이렇게 하면 원하는 열 범위가 효과적으로 선택됩니다.

이 접근 방식의 또 다른 장점은 테이블의 총 열 수에 얽매이지 않으므로 견고하다는 것입니다. 존재하는 열 수에 관계없이 작동합니다.

선택기 구문 설명:

• :nth-child(n X): 모든 하위 항목을 선택합니다. X번째 위치부터.
• :nth-child(-n X): X번째 위치까지의 모든 하위 항목을 선택합니다.

결합 시 이러한 선택자는 다음에 속하는 요소를 대상으로 합니다. 제공된 코드 예시에 예시된 특정 범위.

위 내용은 CSS 선택기를 사용하여 테이블의 특정 열 범위를 대상으로 지정하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!