[CSS] a:link, a:visited, a:hover, a:active

보통 문서를 링크 시키기 위한 a 태그에 많이 사용

<기본 형식>

a:link 방문 전 링크 
a:visited 방문 후 링크 
a:hover 마우스 오버시 링크
a:active 마우스로 클릭시 링크


<사용 예>

a:link { color: #ff0000; text-decoration: none;}
a:visited { color: #00ff00; text-decoration: none;}
a:hover { color: #ff00ff;}
a:active{ color: #0000ff};

순서가 바뀌면 CSS가 제대로 적용되지 않을 수 있으므로, 스타일 적용 순서는 위 순서대로 해야함.

 

a 태그에는 밑줄 스타일 속성(text-decoration: underline)이 기본으로 적용되어 있으므로,

밑줄 스타일 속성을 제거 하고 싶을 떄는 text-decoration 스타일 속성을 none으로 지정하자.

 

a {text-decoration: none;}

 

See the Pen css a:link, a:visited, a:hover, a:active by hbkuk (@hbkuk) on CodePen.