1. CSS 일반 형제 선택자는 다른 요소에 연결된 모든 요소를 참조하며, 두 요소 모두 동일한 상위 요소를 갖습니다.
2. 일반 형제 선택자는 일반 형제에 대한 결합 기호로 물결표(~)를 사용합니다.
예
<!DOCTYPE HTML>
<html>
<머리>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>공통 형제 선택자</title>
<스타일>
.조상 {
너비: 500px;
높이: 300px;
}
.부모 {
너비: 300px;
높이: 200px;
}
.어린이 {
너비: 200px;
높이: 100px;
}
/* 형제가 div인 요소를 .child1 뒤에 배치합니다*/
.child1~div {
배경색: 밝은 산호색;
}
</style>
</head>
<본문>
<div>
이것은 조상입니다.
<div>
이것은 부모입니다.
<div>이것은 child0입니다.</div>
<div>이 아이는 1입니다.</div>
<div>이 아이는 2입니다.</div>
<div>이 아이는 3입니다.</div>
</div>
</div>
</body>
</html>
이상은 CSS 일반 형제 선택기에 대한 이해입니다. 모든 분들께 도움이 되었으면 좋겠습니다.
더 많은 CSS 학습 가이드: CSS 튜토리얼