Web/CSS28 [CSS] 연결 선택자 1. 하위(자손) 선택자 : 부모 요소에 포함된 하위 요소를 모두 선택한다. 즉, 자식요소뿐만 아니라 손자 요소, 손자의 손자 요소등 모든 하위 요소까지 적용된다. ❗️A B{ ...}❗️ HTML CSS JavaScript HTML CSS HTML2 CSS2 JavaScript ❗️{ ... }❗️ 3. 인접 형제 선택자 ❗️A+B{ ... }❗️ 예약 방법 & 이용 요금 아직 온라인 예약 신청이 준비되어 있지 않습니다. 전화(xxx-xxxx-xxxx)로 문의 바랍니다. 가족실(2~4인) : 60,000원/일 도미토리(4인 공용) : 25,000원/일 4. 형제 선택자 ❗️A~B{ ... }❗️ 예약 방법 & 이용 요금 아직 온라인 예약 신청이 준비되어 있지 않습니다. 전화(xxx-xxxx-xxxx).. 2023. 5. 3. [CSS] 가상 클래스 선택자 가상 클래스 선택자 : 선택자 뒤에 :가상이벤트를 붙이면 특정 이벤트마다 적용 할 스타일을 설정 할 수 있다. [사용자 동작에 반응하는 가상 클래스] 1. 방문하지 않은 링크에 스타일을 적용하는 link 2. 방문한 링크에 스타일을 적용하는 visited 3. 특정 요소에 마우스 포인터를 올려 놓으면 스타일을 적용하는 hover 4. 웹 요소를 활성화했을 때 스타일을 적용하는 active 5. 웹 요소에 초점을 맞추었을 때 스타입을 적용하는 focus 방문함 방문안함 [요소 상태에 따른 가상 클래스] 1. target : 같은 문서안에서 다른 위치로 이동할 때는 앵커를 이용한다. 이때 target 선택자를 사용하면 앵커로 연결된 부분, 즉 앵커의 목적지가 되는 부분의 스타일을 쉽게 적용할 수 있다. 2... 2023. 5. 1. [CSS]기본 선택자 1. 전체 선택자 : 문서의 모든 요소에 스타일을 적용한다 ❗️*{ ... }❗️ HTML CSS JavaScript 2. 태그(타입) 선택자 : 특정한 태그(타입)를 사용한 모든 요소에서 스타일을 적용한다. ❗️태그{ ... }❗️ HTML CSS JavaScript 3. 아이디 선택자 : 특정 부분만 선택해서 문서 안에서 한 번만 적용된다. ❗️#아이디{ ... }❗️ HTML CSS JavaScript 4. 클래스 선택자 : 특정 부분만 선택해서 문서안에 여러 번 적용한다. : id 선택자를 여러개 사용한 것과 같은 결과지만 클래스 선택자는 id 대신 class, # 대신 .을 사용한다. ❗️.클래스명{ ... }❗️ HTML CSS JavaScript 5. 그룹 선택자 ❗️A, B{ ... }❗️.. 2023. 4. 30. 이전 1 2 다음