<STYLE type="text/css">
<!--
a:link {text-decoration:none; color:green;}
a:visited {text-decoration: none; color:brown;}
a:hover {text-decoration:underline overline; color:gold;}
a:active {text-decoration:none; color:red;}
-->
</STYLE>
<!--
link에 대해 모든 링크상태(visited, hover, active)는 선언위치에 상관없이 항상 우선함
나머지 링크상태는 선언위치가 아래일수록 우선함.
위의 경우, visited상태와 hover, active 상태가 병행할 경우에는,
visited보다 아래에 선언된 hover, active상태가 우선하며,
hover상태와 active상태가 병행할 경우, 아래에 있는 active상태가 우선함
그러므로 위의 순서대로 선언하면 링크의 모든 속성이 적용되는 것을 확인할 수 있다.
-->
</HEAD>
<BODY><H3> 하이퍼링크 스타일</H3>
<a href="http://www.naver.com">네이버 </a> <br>
</BODY></HTML>
<html>
<head>
<style type="text/css">
/* A 태그 안에 직접 class를 적용하려면 다음과 같이 클래스를 선언해야 한다*/
a.class1:link {text-decoration: none}
a.class1:visited {color:gray}
a.class1:hover {text-decoration: underline; color: green;}
a.class1:active {text-decoration: none}
/* 다음과 같이 클래스를 선언해 주면 span, div태그 안에 있는 A 태그 모두에게 적용할 수 있다*/
.class2 A:link {text-decoration: underline overline}
.class2 A:visited {color:green}
.class2 A:hover {text-decoration: underline; color: green;}
.class2 A:active {text-decoration: underline overline}
</style>
</head>
<body>
ONE TYPE OF LINKS
<br>
<a href="http://www.yahoo.com" class="class1">YAHOO</a>
<br>
<a href="http://www.google.com" class="class1">GOOGLE</a>
<br>
<br>
ANOTHER TYPE OF LINKS
<br>
<span class="class2">
<a href="http://www.yahoo.com">YAHOO</a>
<br>
<a href="http://www.google.com">GOOGLE</a>
</span>
</body>
</html>