CSS의 더하기 기호는 무엇을 의미합니까?

CSS의 더하기 기호는 "+"입니다. 이는 인접한 형제 선택기를 의미합니다. 이 선택기는 지정된 요소 뒤에 있는 인접한 형제 요소를 일치시킬 수 있습니다.

이 문서의 운영 환경: Windows 7 시스템, CSS3 버전, Dell G3 컴퓨터.

CSS에서 더하기 기호는 무엇을 의미하나요?

"+"는 "인접 형제 선택기"라고 불리는 인접한 형제를 선택합니다. 선택기는 지정된 요소 뒤에 있는 인접한 형제 요소를 일치시킬 수 있습니다.

다른 요소 바로 다음에 요소를 선택해야 하고 둘 다 동일한 상위 요소가 있는 경우 인접 형제 선택기를 사용할 수 있습니다. 예를 들어 h1 요소 바로 뒤에 나타나는 단락의 위쪽 여백을 늘리려면 다음과 같이 쓸 수 있습니다. h1 + p {margin-top:50px;}

이 선택기는 다음과 같습니다. "h1 요소 바로 뒤에 나타나는 단락을 선택합니다. h1 및 p 요소 동일한 상위 요소가 있습니다."

확장 정보:

인접 형제 선택자는 인접 형제 조합 기호인 더하기 기호(+)를 사용합니다. 참고: 하위 결합자와 마찬가지로 인접한 형제 결합자 옆에는 공백이 있을 수 있습니다.

div 요소에는 순서가 지정되지 않은 목록과 순서가 지정된 목록이라는 두 개의 목록이 포함되어 있으며 각 목록에는 세 개의 목록 항목이 포함되어 있습니다. 두 목록은 목록 항목 자체와 마찬가지로 인접한 형제입니다.

그러나 첫 번째 목록의 목록 항목과 두 번째 목록의 목록 항목은 인접한 형제가 아닙니다. 두 목록 항목 세트가 동일한 상위 요소에 속하지 않기 때문입니다(최대 사촌으로 간주될 수 있음). ).

결합기를 사용하면 인접한 두 형제 중 두 번째 요소만 선택할 수 있다는 점을 기억하세요. 아래 선택기를 살펴보세요.

li + li {font-weight:bold;}

위 선택기는 목록의 두 번째와 세 번째 목록 항목만 굵게 표시합니다. 첫 번째 목록 항목은 영향을 받지 않습니다.

다른 선택기와 결합:

인접 형제 결합자는 다른 결합자와도 결합할 수 있습니다.

html > body table + ul {margin-top:20px;}

이 선택기는 다음과 같이 설명됩니다. 본문에 포함된 테이블 요소 바로 뒤에 나타나는 모든 형제 ul 요소를 선택합니다. 요소에서 body 요소 자체는 html 요소의 하위 요소입니다.

추천 학습: "css 동영상 튜토리얼"

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