CSS 선택자
- 특정 HTML 태그를 선택할 때 사용하는 기능
- 선택한 태그에 원하는 스타일 또는 스크립트 적용 가능
CSS 선택자의 종류
- 태그 선택자 : 해당하는 태그를 선택한다. h1{ }
- 아이디 선택자 : 해당하는 id를 선택한다. id 속성은 중복되지 않아야 한다. #id{ }
- 클래스 선택자 : 해당하는 class를 선택한다. Class 속성은 중복가능(일괄처리). .class{ }
- 속성 선택자 : 해당하는 속성을 선택한다.
반응 선택자
- 선택자 : active - 클릭되었을 때
- 선택자 : hover - 마우스를 올렸을 때
- 선택자 : checked - 체크되었을 때
- 선택자 : not(선택자)
가상 클래스
- 선택자 : after : 태그 컨텐츠 다음에 내용을 넣기 위해 사용
- 선택자 : before : 태그 컨텍츠 이전에 내용을 넣기 위해 사용
CSS 선택자
Selector
Section,ul - section+ul
Section ul - section의 모든자손
Section > ul - section의 직계자손(바로아래ul)
Header ~p - header의 모든 형제 요소
Header +p - header의 근접 형제 요소 (header와 모든 근접 형제p)
의사 요소
- 요소의 특정 부분에 스타일을 적용하기 위해 사용되는 가짜 요소
::after - <?>태그 컨텐츠 다음에 내용을 넣는다
::before - <?>태그 컨텐츠 이전에 내용을 넣는다
::selection <?>태그 컨텐츠에서 사용자가 선택한 부분
-
'프로그래밍 > HTML.CSS' 카테고리의 다른 글
CSS실습 - 예제페이지 만들어보기 (0) | 2018.06.28 |
---|---|
CSS 속성 (0) | 2018.06.27 |
HTML - 첫번째 수업 (0) | 2018.06.26 |
웹표준 - HTML (0) | 2018.06.26 |