CSS3 후속 형제 조합자 (~)

정의와 사용법

CSS 후속 형제 조합자 (~) 첫 번째 요소 (element1) 이후에 나타나는 element2.

element1 그리고 element2 같은 부모 요소를 공유해야 하지만 element2 직접 뒤에 있지 않아도 됩니다 element1 뒤에.

예제

모든 <p> 요소 뒤에 있고 같은 부모 요소를 공유하는 <ul> 요소의 스타일을 선택하고 설정합니다:

p ~ ul {
  background-color: gold;
  border: 1px solid gray;
}

개인적으로 시도해 보세요

CSS 문법

element1 ~ element2 {
  css 선언;
}

기술 세부 사항

버전: CSS3

브라우저 지원

표中的 숫자는 이 조합자를 최초로 지원하는 첫 번째 브라우저 버전을 나타냅니다。

Chrome Edge Firefox Safari 오페라
4.0 7.0 3.5 3.2 9.6