css 가상선택자
:link, :visited, :hover, :active, :focus, :first-child
:first-line, :first-letter, :before, :after
가상 선택자란 실제로는 존재하지 않는 요소나 특수한 상황에서만 발생하는 동적인 요소를 CSS 명령으로 제어하는 기법이다.
가상 선택자의 종류는 2가지.
1) ‘가상 클래스 선택자’
가상 클래스 선택자(:link, :visited, :hover, :active, :focus, :first-child)는 특정 요소에 마치 동적으로 class를 부여한 것과 비슷
2) ‘가상 요소 선택자’
가상 요소 선택자(:first-line, :first-letter, :before, :after)는 실제로 존재하지 않는 요소를 마치 존재하는 것처럼 이용
예) .container:after { content:””; clear:both; display:block; }
ex) :after 라는 가상 요소 선택자는 content 라는 속성을 이용해서 .container 블럭이 끝나기 직전 content 속성의 값 “*” 을 화면에 출력할 수 있음. 이렇게 생성된 요소에 clear:both 속성을 부여하면 자식의 높이를 부모에게 전달할 수 있는데 실제로 HTML 코드에는 빈 요소가 존재하지 않기 때문에 가장 이상적인 방법이라고 할 수 있음. 그러나 IE 6~7 브라우저는 가상 요소 선택자를 지원하지 않음