CSS/개념정리
[결합자] 인접 형제 결합자 (Adjacent Sibiling Combinator)
xowoony
2022. 9. 6. 22:25
학습일 : 2022. 09. 05
인접 형제 결합자
인접 형제 결합자(Adjacent Sibiling Combinator)는 어떠한 선택자에 대한 인접한 형제를 선택하기 위해
사용하는 결합자이다.
다음과 같이 작성한다. ("는 없는 것으로 한다.)
"어떠한 선택자" + "형제 선택자" {
"속성" : "속성 값";
"속성" : "속성 값";
"속성" : "속성 값";
}
아래 조건을 만족하는 경우 선택된다.
1. 위 작성 예시에서 "어떠한 선택자"와 "형제 선택자"는 같은 부모를 가져야한다.
2. 위 작성 예시에서 "형제 선택자"는 "어떠한 선택자" 바로 뒤에 와야한다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>인접 형제 결합자</title>
<style>
body > div > b + br + a + br + a {
color: red;
}
body > div > i + br + a {
color: red;
}
</style>
</head>
<body>
<div>
<b>주의 사항</b>
<br>
<a>1. 어쩌고</a>
<br>
<a>2. 저쩌고</a>❤
<br>
<a>3. 그렇고</a>
<br>
<br>
<i>참고 사항</i>
<br>
<a>- 어쩌고</a>❤
<br>
<a>- 저쩌고</a>
<br>
<a>- 그렇고</a>
</div>
</body>
</html>============실행결과=============
