> 웹 프론트엔드 > CSS 튜토리얼 > 범용 선택기 (CSS 선택기)

범용 선택기 (CSS 선택기)

Joseph Gordon-Levitt
풀어 주다: 2025-02-27 08:32:10
원래의
601명이 탐색했습니다.

Universal Selector (CSS Selector)

범용 선택기 (CSS 선택기)

설명 범용 선택기는 모든 요소 유형과 일치합니다. 간단한 선택기의 유일한 구성 요소가 아닌 경우 암시 (따라서 생략) 할 수 있습니다. 여기에 표시된 두 가지 선택기 예는 다음과 같습니다

범용 선택기를 와일드 카드 문자와 혼동하지 않는 것이 중요합니다. 범용 선택기는 "0 이상의 요소"와 일치하지 않습니다. 다음 HTML 조각을 고려하십시오

선택자 div * em은 다음 요소와 일치합니다.

H1 요소의 "Universal"(*

) p 요소에서 "강조"(*

) 첫 번째 Li 요소에서 "NOT"(*

    또는
  • )
  • 와 일치합니다. 두 번째 li 요소의 "type"(*
      또는
    • )
    • 와 일치합니다.

그러나 즉시 요소와 일치하지 않습니다. 왜냐하면 그것은 div 요소의 즉각적인 자식이기 때문에
사이에는 아무것도 없기 때문입니다.
*.warning {
  ⋮ <span>declarations
</span>}
.warning {
  ⋮ <span>declarations
</span>}
로그인 후 복사
예 이 규칙 세트는 문서의 모든 요소에 적용됩니다.

CSS의 범용 선택기에 대한 자주 묻는 질문 CSS의 범용 선택기와 다른 선택기의 차이점은 무엇입니까?

<body>
  <div>
    <h1>The <em>Universal</em> Selector</h1>
    <p>We must <em>emphasize</em> the following:</p>
    <ul>
      <li>It's <em>not</em> a wildcard.</li>
      <li>It matches elements regardless of <em>type</em>.</li>
    </ul>
    This is an <em>immediate</em> child of the division.
  </div>
</body>
로그인 후 복사
CSS의 범용 선택기는 별표 (*)로 표시되며 문서의 모든 요소와 일치합니다. 클래스 선택기, ID 선택기 또는 클래스, ID 또는 요소 유형을 기반으로 특정 요소 만 일치하는 요소 선택기와 같은 다른 선택기와 다릅니다. 범용 선택기는 강력한 도구이지만 신중하게 사용하지 않으면 예상치 못한 결과로 이어질 수 있으므로 드물게 사용해야합니다.

범용 선택기가 다른 선택기와 결합 될 수 있습니까? 예, 범용 선택기는 다른 선택기와 결합하여보다 구체적인 규칙을 만들 수 있습니다. 예를 들어, 범용 선택기와 클래스 선택기를 결합하여 특정 클래스를 가진 모든 요소에 스타일을 적용 할 수 있습니다.

    범용 선택기의 특이성은 무엇입니까?
  • 범용 선택기는 CSS에서 가장 낮은 특이성을 갖습니다. 이는 충돌 스타일이있는 경우 범용 선택기에 의해 정의 된 스타일이 다른 선택기가 정의한 스타일로 무시할 것임을 의미합니다.
  • 범용 선택기가 성능에 영향을 미칩니 까?
  • 범용 선택기는 성능에 영향을 줄 수 있지만 일반적으로 현대 브라우저에 영향을 줄 수 있습니다. 그러나 브라우저가해야 할 작업의 양을 줄이기 위해 가능할 때마다 더 많은 특정 선택기를 사용하는 것은 여전히 ​​우연한 사례입니다. 범용 선택기를 미디어 쿼리에 사용할 수 있습니까?

    예, 범용 선택기는 미디어 쿼리에 사용할 수 있습니다. 이것은 뷰포트가 특정 너비 일 때와 같은 특정 조건에서 페이지의 모든 요소에 스타일을 적용하는 데 유용 할 수 있습니다.

    범용 선택기가 CSS의 유전과 어떻게 상호 작용 하는가?

    범용 선택기는 상속 스타일을 재정의 할 수 있습니다. 그러나 특이성이 가장 낮기 때문에 다른 선택기에 의해 상환 될 수 있습니다.

    범용 선택기가 의사 요소와 의사 클래스를 대상으로 할 수 있습니까?

    예, 범용 선택기는 의사 요소와 의사 클래스를 대상으로 할 수 있습니다. 그러나 이러한 경우에 더 많은 특정 선택기를 사용하는 것이 일반적입니다.

    범용 선택기의 일반적인 사용 사례는 무엇입니까?

    범용 선택기는 종종 기본 여백을 제거하고 모든 요소의 패딩과 같은 스타일을 재설정하는 데 사용됩니다. 또한 기본 글꼴 또는 색상을 설정하는 등 페이지의 모든 요소에 스타일을 적용하는 데 사용될 수 있습니다.

    범용 선택기 사용에 대한 단점이 있습니까?

    범용 선택기는 강력한 도구이지만 드물게 사용해야합니다. 과용은 예상치 못한 결과로 이어질 수 있으며 CSS를 유지하기가 더 어려워 질 수 있습니다. 또한 현대식 브라우저에서는 일반적으로 무시할 수 있지만 성능에 영향을 줄 수 있습니다.

    범용 선택기는 다른 브라우저에서 어떻게 작동합니까?

    범용 선택기는 Chrome, Firefox, Safari 및 Edge를 포함한 모든 최신 브라우저에서 지원됩니다. 그러나 구현 방법에는 약간의 차이가있을 수 있으므로 여러 브라우저에서 CSS를 테스트하는 것이 항상 좋은 생각입니다.

위 내용은 범용 선택기 (CSS 선택기)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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