CSS 링크(a:link, a:visited, a:hover, a:active)

 4가지 링크 상태

링크 텍스트의 상태는 4가지로 구분할 수 있다.

● 첫째는 사용자가 링크를 방문하기 전의 상태

● 둘째는 사용자가 링크를 방문했을 때의 상태

● 세째는 사용자가 마우스를 링크 텍스트 위에 올려 났을 때의 상태

● 네째는 사용자가 마우스로 링킁 텍스트를 클리한 순간의 상태

 4가지 링크 상태별로 텍스트 색깔을 바꿔보자!

이 4가지 상태를 css에서 선택자와 속성을 사용하여 상태별로 변화를 지정할 수 있다.

각 상태별로 텍스트의 color 변화하도록 만들어 보자.(백그라운드 컬러, 폰트로도 할 수 있다)

이때 사용되는 선택자는 아래와 같다.

● a:link : 방문하기전의 링크

● a:visited : 방문한 링크

● a:hover : 링크에 마우스 포인터를 올려 놓았을 때

● a:active : 링크를 마우스로 클릭한 순간

이제 color 속성과 속성값을 붙여 보자.

● a:link { color: blue; }

● a:visited { color: red; }

● a:hover { color: green; }

● a:active { color: ornge; }

 링크의 언더라인을 제거하기!

링크 텍스트에는 underline이 그어져 있다.

text-decoration 속성과 none을 속성값을 이용하자 underline을 제거할 수 있다.