링크와 관련된 가상 클래스 선택자
:link - 방문한 적이 없는 링크
:visited - 방문한 적이 있는 링크
:hover - 마우스를 롤오버 했을 때
:active - 마우스를 클릭했을 때
위의 선택자는 순서대로 지정하는 것이 좋습니다. 특히 visited의 경우는 보안상의 이유로 아래와 같은 속성만 변경이 가능합니다.
color
background-color
border-color
outline-color
The color parts of the fill and stroke properties
클래스 선택자처럼 동작하지만 여러가지 선택들을 하게 하며 각각의 엘리먼트들의 상태에 따라서 선택하는 선택자
두 개가 동급이면 뒷쪽이면 뒤에 있는 선택자를 선택한다
visited는 보안상 일부속성만 쓸 수 있다
focus는 여러가지 이유로 맨 뒤에다가 놓는게 좋다
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
a:link{
color:black
}
a:visited{
color:red;
}
a:hover{
color:yellow
}
a:active{
color:green;
}
a:focus{
color:white
}
input:focus{
background-color:black;
color:white
}
</style>
</head>
<body>
<a href="http://opentutorials.org">방문함</a>
<a href="http://a.a">방문안함</a>
<input type="text">
</body>
</html>
댓글