> 웹 프론트엔드 > CSS 튜토리얼 > CSS 선택기에서 하위 항목을 어떻게 그룹화할 수 있나요?

CSS 선택기에서 하위 항목을 어떻게 그룹화할 수 있나요?

Susan Sarandon
풀어 주다: 2024-11-01 10:30:02
원래의
259명이 탐색했습니다.
How Can We Group Descendants in CSS Selectors? 
`

.

.
.

<th></th>
<th></th>
<th></th>
로그인 후 복사



`

일반적으로 모든 열 머리글과 셀의 스타일을 지정합니다. 자세한 선택기가 필요합니다:

<td></td>
<td></td>
<td></td>
로그인 후 복사
#myTable th, #myTable td {}


대신 다음과 같은 구문을 사용할 수 없는 이유는 무엇입니까?

#myTable (th,td ) {}

제안된 솔루션

최근까지 CSS 선택기에서 하위 항목을 그룹화하기 위한 표준 솔루션이 없었습니다. 그러나 다음과 같은 의사 클래스가 제안되었습니다:

:-moz-any()

: 2010년에 Mozilla에 의해 도입되었습니다.

    : -webkit-any()
  • : WebKit 브라우저에 권장되지만 널리 채택되지는 않습니다.
  • 그러나 이러한 접두사가 붙은 선택기를 사용하려면 중복 규칙 세트가 필요하므로 공개 코드에는 권장되지 않습니다.
  • 향후 개발

선택기 레벨 4 작업 초안은 원래 :any() 제안을 기반으로 :matches() 의사 클래스를 제안합니다. 이 새로운 의사 클래스는 향후 개정판에서 향상된 기능을 제공할 수 있습니다.

해결 방법

th 및 td 요소 모두의 스타일을 지정하는 특정 경우에는 * 선택기를 사용할 수 있습니다.

#myTable tr > * {}이는 tr 요소에 셀 요소만 포함되어 있다고 가정합니다. 그러나 성능에 민감한 개발자에게는 이 방법이 장황한 방법만큼 효율적이지 않습니다.

위 내용은 CSS 선택기에서 하위 항목을 어떻게 그룹화할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿