a:link { } - 방문 전 링크 상태.
a:visited { } - 방문 후 링크 상태.
a:hover { } - 링크에 마우스를 올렸을 때 상태.
a:active { } - 링크를 클릭했을 때의 짧은 순간.
링크 태그를 쓸 때는 순서가 있다. 반드시 link - visitde - hover - active 순서로 써야한다. 나 이거 몰랐어...=-=
- text-decoration
text-decorationd은 링크에서 주로 밑줄을 제거할 때 사용한다.
a:link {text-decoration: none;}
a:hover {a {text-decoration: none: underline;}
- background-color
링크 태그에 백그라운드 색을 지정할 수 있다.
a:link {background-color: tomato;}
a:visited {background-color: blue;}
a:hover {background-color: red;}
a:active {background-color: white;}
- 위의 태그를 이용해 예쁜 링크 버튼 만들기
a:link, a:visited {
background-color: #f44336;
color: white;
padding: 14px 25px;
text-align: center;
text-decoration: none;
display: inline-block;
}
a:hover, a:active {
background-color: red;
}