:link
CSS 의사 클래스는 아직 방문하지 않은 요소를 나타냅니다. href
속성을 가진 <a>
, <area>
, <link>
중 방문하지 않은 모든 요소를 선택합니다.
/* 아직 방문하지 않은 <a> 요소를 선택 */
a:link {
color: red;
}
:link
의사 클래스로 정의한 스타일은 자신보다 뒤에 위치하고 동등한 명시성을 가진 다른 링크 의사 클래스(:active
, :hover
, :visited
)가 덮어씁니다. 링크를 적절히 디자인하려면 LVHA-순서(:link
— :visited
— :hover
— :active
)를 따라, :active
규칙을 다른 모든 링크 규칙들보다 앞에 배치하세요.
참고: 방문 여부에 상관하지 않고 요소를 선택하려면 :any-link
를 사용하세요.
구문
:link
예제
대부분의 브라우저는 방문한 링크에 기본값으로 특별한 color
값을 지정합니다. 따라서 다음 예제의 링크를 방문한 적이 없을 때만 글자 색이 적용된 모습을 볼 수 있고, 방문한 적이 있으면 브라우저 기록을 지워서 확인할 수 있습니다. 그러나 방문한 링크의 배경색은 보통 브라우저가 지정하지 않으므로 background-color
는 계속 확인할 수 있습니다.
HTML
<a href="#ordinary-target">평범한 링크입니다.</a><br>
<a href="">이 링크는 이미 방문했습니다.</a><br>
<a>플레이스홀더 링크 (스타일 적용 안됨)</a>
CSS
a:link {
background-color: gold;
color: green;
}
결과
명세
Specification | Status | Comment |
---|---|---|
HTML Living Standard The definition of ':link' in that specification. |
Living Standard | |
Selectors Level 4 The definition of ':link' in that specification. |
Working Draft | No change. |
Selectors Level 3 The definition of ':link' in that specification. |
Recommendation | No change. |
CSS Level 2 (Revision 1) The definition of ':link' in that specification. |
Recommendation | Lift the restriction to only apply it for <a> element. |
CSS Level 1 The definition of ':link' in that specification. |
Recommendation | Initial definition. |
브라우저 호환성
BCD tables only load in the browser
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.