CSS :tager 동적 유사 클래스

CSS :tager 동적유사클래스 (css3)

사용자가 클릭할 경우의 원본의 부분을 강조하기 위한 재미있는 새로운 방법. 필요한것은 클릭해야하니 링크, 그리고 효과가 지정될 엘리먼트, 그리소 css 설정이다. 예를들어보자 클릭하게되면 지장된곳의 상태가 css에서 지정한것으로 바뀐다.예제를 보자

 
먼저 여기를클릭하시오
 
다음 여기를클릭하시오
 
 

먼저 여기 배경색이 빠뀜
폰트크기가 바뀜

css는 다음과 같이

#first:target{
background: #ffff7e;
}
#second:target{ font-size:25px;}

첫번쪠 지정한 곳은 배경색이바뀐다. 두번째 지정한곳은 크기가 바뀐다.

이런 target 은 한페이지내에 링크를 걸어둘경우 선택되었을떄 특별히 주목받도록 변경시킬때 사용된다.

직접예제를 보려면 여기로GO