CSS의 선택자는 무엇입니까?

css 선택기에는 다음이 포함됩니다. 1. 와일드카드 선택기 3. 클래스 선택기 5. 인접 선택기 "E>F" . 하위 선택자 "E F" 8. ":first"와 같은 의사 클래스 및 의사 요소 선택자.

이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.

css 선택기(selector)는 어떤 DOM 요소 또는 CSS 스타일을 사용해야 하는지 지정하는 데 사용되는 사양입니다.

각 CSS 스타일 정의는 두 부분으로 구성되며 형식은 다음과 같습니다. 选择器{样式} {} 앞 부분은 "선택기"입니다.

"선택기"는 {}에서 "스타일"의 개체(dom 개체), 즉 "스타일"이 작동하는 웹페이지의 요소를 지정합니다.

CSS 선택자(선택자)란 무엇인가요?

1. 와일드카드 선택기(*): 모든 요소와 일치합니다.

2. ID 선택기(# myid): ID가 "myid"인 모든 요소와 일치합니다.

3. 클래스 선택기(.myclassname): 클래스가 "myclassname"과 동일한 요소와 일치합니다.

4. 태그 선택기(div, h1, p): 지정된 요소 이름을 가진 모든 요소를 ​​선택합니다.

5. 인접 선택기(E + F): 지정된 첫 번째 요소 바로 뒤에 있는 요소를 선택하는 데 사용됩니다(내부적으로는 아님).

6. 하위 선택기(E > F): 특정 상위 요소가 있는 요소를 선택하는 데 사용됩니다(예: ul > li). 상위 요소가

(학습 영상 공유: css 영상 튜토리얼)

7. 하위 선택자(E F): 요소 내부의 요소를 선택하는 데 사용됩니다.

8. 의사 클래스 및 의사 요소 선택기: 특정 선택기에 특수 효과를 추가하는 데 사용됩니다.

ㅋㅋㅋ :drop :empty:enabled:first:first-child:first-of-type:fullscreen:future:focus:focus-visible:focus -within:has():host:host():host-context():hover:indeterminate:in-range:invalid:is() :lang():last-child:last-of-type:left:link:local-link:not():nth-child() :nth-col():nth-last-child():nth-last-col():nth-last-of-type():nth-of-type ():독생

:유형만	:선택적	:범위 밖	:past	:placeholder-shown	:읽기 전용
:읽기-쓰기	:필수	:right	:root	:scope	:target
:target-within	:user-invalid	:valid	:visited	:where()

9. 속성 선택기: 특정 속성을 가진 요소를 선택합니다.


• [속성]: 지정된 속성을 가진 요소를 선택하는 데 사용됩니다.

• [속성=값]: 지정된 속성과 값을 가진 요소를 선택하는 데 사용됩니다.

• [attribute~=value]: 속성 값에 지정된 어휘가 포함된 요소를 선택하는 데 사용됩니다.

• [attribute|=value]: 지정된 값(전체 단어여야 함)으로 시작하는 속성 값을 가진 요소를 선택하는 데 사용됩니다.

• [attribute^=value]: 속성 값이 지정된 값으로 시작하는 모든 요소와 일치합니다.

• [attribute$=value]: 속성 값이 지정된 값으로 끝나는 모든 요소와 일치합니다.

• [attribute*=value]: 속성 값에 지정된 값이 포함된 모든 요소와 일치합니다.

더 많은 프로그래밍 관련 지식을 보려면 프로그래밍 소개를 방문하세요! !


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