:visited CSS 의사 클래스는 사용자가 방문한 적이 있는 링크를 나타냅니다. :visited가 바꿀 수 있는 스타일은 개인정보 보호를 위해 매우 제한적입니다.

/* 방문한 적이 있는 <a> 선택 */
a:visited {
  color: green;
}

:visited 의사 클래스로 정의한 스타일은 자신보다 뒤에 위치하고 동등한 명시성을 가진 다른 링크 의사 클래스(:link, :hover, :active)가 덮어씁니다. 링크를 적절히 디자인하려면 LVHA-순서(:link:visited:hover:active)를 따라, :visited 규칙을 :link 뒤, :hover:active 앞에 배치하세요.

스타일 제한

브라우저는 개인정보 보호를 위해 :visited에서 사용할 수 있는 스타일을 엄격히 제한하고 있습니다.

참고: 스타일 제한에 관한 더 많은 정보와 이유에 대해서는 개인정보와 :visited 선택자 문서를 참고하세요.

구문

:visited

예제

기본적으로 색이 없거나 투명한 속성은 :visited로 수정할 수 없습니다. :visited가 수정 가능한 속성 중 브라우저가 기본값을 지정하는건 보통 colorcolumn-rule-color 뿐입니다. 따라서 다른 속성을 수정하고 싶다면 기본값을 직접 지정해야 합니다.

HTML

<a href="#test-visited-link">링크를 아직 방문하지 않으셨나요?</a><br>
<a href="">이미 방문했습니다.</a>

CSS

a {
  /* 특정 속성에 투명하지 않은 기본값을 지정해
     :visited 상태로 바꿀 수 있도록 설정 */
  background-color: white;
  border: 1px solid white;
}

a:visited {
  background-color: yellow;
  border-color: hotpink;
  color: hotpink;
}

결과

명세

Specification Status Comment
HTML Living Standard
The definition of ':visited' in that specification.
Living Standard  
Selectors Level 4
The definition of ':visited' in that specification.
Working Draft No change.
Selectors Level 3
The definition of ':visited' in that specification.
Recommendation No change.
CSS Level 2 (Revision 1)
The definition of ':visited' in that specification.
Recommendation Lifts the restriction to only apply :visited to the <a> element. Lets browsers restrict its behavior for privacy reasons.
CSS Level 1
The definition of ':visited' in that specification.
Recommendation Initial definition.

브라우저 호환성

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
:visitedChrome Full support 1Edge Full support 12Firefox Full support 1IE Full support 4Opera Full support 3.5Safari Full support 1WebView Android Full support 4.4Chrome Android Full support 18Edge Mobile Full support 12Firefox Android Full support 4Opera Android Full support 10.1Safari iOS Full support 9.3Samsung Internet Android ?
Restrict CSS properties allowed in a statement using :visited for privacyChrome Full support 6Edge Full support 12Firefox Full support 4IE Full support 8Opera Full support 15Safari Full support 5WebView Android Full support 37Chrome Android Full support 18Edge Mobile Full support 12Firefox Android Full support 4Opera Android ? Safari iOS ? Samsung Internet Android ?

Legend

Full support  
Full support
Compatibility unknown  
Compatibility unknown

같이 보기

문서 태그 및 공헌자

이 페이지의 공헌자: alattalatta, mdnwebdocs-bot
최종 변경자: alattalatta,