CSS :visited 가상 클래스

정의와 사용법

CSS :visited 가상 클래스는 방문한 링크의 스타일을 설정하는 데 사용됩니다.

힌트:사용하세요 :link 미방문 페이지의 링크 스타일을 설정하려면, :hover 마우스 오버 시 링크 스타일을 설정하려면, :active 클릭 시 링크 스타일을 설정합니다.

주의:링크 스타일을 올바르게 설정하려면, :visited 규칙을 두드림 :link 규칙 이후에, 하지만 :hover 및 :active 규칙 이전에.

허용되는 스타일은 다음과 같습니다:

• color
• background-color
• border-color（각 경계의 border-color）
• outline color
• column-rule-color
• text-decoration-color
• text-emphasis-color
• SVG 속성 fill과 stroke

예제

예제 1

방문한 링크의 스타일을 선택하고 설정합니다:

a:visited {
  color: pink;
}

본인이 직접 시도해 보세요

예제 2

미방문, 방문한, 오버 및 활성 링크의 스타일을 선택하고 설정합니다:

/* 방문하지 않은 링크 */
a:link {
  color: green;
}
/* 방문한 링크 */
a:visited {
  color: green;
}
/* 마우스 오버 링크 */
a:hover {
  color: red;
}
/* 활성 링크 */
a:active {
  color: yellow;
}

본인이 직접 시도해 보세요

예제 3

링크에 다른 스타일을 설정합니다:

a.ex1:hover, a.ex1:active {
  color: red;
}
a.ex2:hover, a.ex2:active {
  font-size: 150%;
}

본인이 직접 시도해 보세요

CSS 문법

:visited {
  css 선언;
}

기술 세부 사항

브라우저 지원

표에서의 숫자는 이 가상 클래스를 완전히 지원하는 첫 번째 브라우저 버전을 지정합니다.

관련 페이지

교육:CSS 링크

교육:CSS 의 가상 클래스