HTML/CSS(하이퍼링크 관련 스타일)

※ 하이퍼링크 관련 스타일

1) 문서 전체에 일관된 하이퍼링크 속성 적용

a:link {보통 상태의 텍스트 메뉴 속성과 값;}

a:visited {방문한 적이 있는 상태의 텍스트 메뉴 속성과 값;}

a:active {클릭한 상태의 텍스트 메뉴 속성과 값;}

a:hover {마우스를 가져다 대었을 경우의 텍스트 메뉴 속성과 값;}

예)

a:link {color:#000000; text-decoration:none; font-size:9pt;}

a:visited {color:#000000; text-decoration:none; font-size:9pt;}

a:active {color:#000000; text-decoration:none; font-size:9pt;}

a:hover {color:#336699; text-decoration:underline; font-size:9pt;}

2) selector 사용

.selector a:상태 {상태에 따른 텍스트 메뉴 속성과 값;}

여러가지 속성의 하이퍼링크 모양을 한 문서에 지정할수 있다.

예)

.green a:link {color:green; text-decoration:none; font-size:9pt;}

.green a:visited {color:green; text-decoration:none; font-size:9pt;}

.green a:active {color:green; text-decoration:none; font-size:9pt;}

.green a:hover {color:green; text-decoration:underline; font-size:9pt;}

.red a:link {color:red; text-decoration:none; font-size:9pt;}

.red a:visited {color:red; text-decoration:none; font-size:9pt;}

.red a:active {color:red; text-decoration:none; font-size:9pt;}

.red a:hover {color:red; text-decoration:underline; font-size:9pt;}

▶ 적용

<div class="red"><a href="#">메뉴1</a></div>

/*div외에 p등 매개체 태그필요*/