관계형 선택자란 무엇입니까?

관계 선택자에는 "하위 선택자", "하위 요소 선택자", "인접 형제 선택자" 및 "보편 형제 선택자"가 포함됩니다. 1. 하위 선택자는 하위 관계를 통해 요소를 선택합니다. 2. 하위 요소 선택자는 요소의 요소를 통해 요소를 선택합니다. 부모-자식 관계 3. 인접 형제 선택자는 요소의 인접 형제 관계를 통해 요소를 선택합니다. 4. 범용 형제 선택자는 요소의 형제 관계를 통해 요소를 선택합니다.

이 튜토리얼의 운영 체제: Windows 10 시스템, Dell G3 컴퓨터.

관계형 선택자는 요소 간의 관계를 선택하는 데 사용됩니다. 다음은 몇 가지 일반적인 관계형 선택자입니다.

1. 하위 선택자: 하위 관계를 통해 요소를 선택합니다.

div p {  
color: blue;
}

위의 예에서는

요소 내에 있는 모든

요소가 선택되며 텍스트 색상은 파란색으로 설정됩니다.

2. 하위 선택기: 상위-하위 관계를 통해 요소를 선택합니다.

div > p {  
font-weight: bold;
}

위의 예에서는

요소 내부의 모든

요소가 선택되고 글꼴이 굵게 표시됩니다.

3. 인접 형제 선택기: 인접한 형제 관계를 기반으로 요소를 선택합니다.

h1 + p {  
color: red;
}

위의 예에서는

요소 바로 뒤에 있는

요소가 선택되고 텍스트 색상이 빨간색으로 설정됩니다.

4. 일반 형제 선택기: 형제 관계를 기준으로 요소를 선택합니다.

h1 ~ p {  
font-style: italic;
}

위의 예에서는

요소 뒤에 있는 모든

요소가 선택되고 글꼴 스타일이 기울임꼴로 설정됩니다.

이러한 관계형 선택기를 사용하면 요소를 더 정확하게 선택하고 요소 간의 특정 관계를 기반으로 스타일을 적용할 수 있습니다. 관계형 선택기를 합리적으로 사용하면 페이지 요소의 스타일을 유연하게 제어할 수 있습니다.

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