하이퍼링크

1. a 태그의 href 속성을 이용하여 하이퍼링크 작성
2. 하이퍼링크(hyper link)란?
   1) 다른 html 페이지와의 연결 고리
   - 같은 웹 사이트의 다른 html 페이지
   - 다른 웹 사이트의 html 페이지 모두 연결 가능
   2) 하이퍼링크는 텍스트나 이미지로 작성
3. 항해(navigation)
   1) 하이퍼링크를 따라 다른 웹 페이지를 방문하는 것을 말한다.
4. 기본 형식

<a href="url" target="대상윈도우|frame">링크문자</a>
<a href="url#앵커이름" target="대상윈도우|frame">링크문자</a>

1) url : 외부 또는 내부 자원에 대한 주소를 호출
- 외부 : http://www.naver.com과 같이 외부에서 접근이 가능한 사이트 자원
- 내부 : 절대주소/상대주소를 이용하여 현재 서버와 연결된 자원을 접근하는 것
2) #앵커이름 : 해당 페이지의 특정한 위치를 id="앵커명"으로 속성을 정해서 해당 위치로 이동하게 하는 것
3) target : 링크가 된 자원을 로딩하는 방식을 말한다.
기본적으로 전체 페이지가 대체되는데, 특정한 경우에 새로운 윈도우 창이나 현재 페이지에서 frame으로 지정한 부분만 변경할 수 있다.

<h3 id="main"> 하이퍼링크 <h3>
<a href = "#go">같은 html내의 지정한 앵커 위치로 이동</a>
<a href = "http://www.naver.com">외부사이트로 이동</a>
<a href = "/a01_start/a01_tag_basic.html">절대주소로 이동</a>
<a href="/a02_basic/a05_page.html#pos01">절대주소로 이동해서 특정 위치로 이동</a>

<h4 id="go">앵커위치<h4>
<a href = "#main">원래 위치로 이동</a>

하이퍼링크 텍스트 색상

1. 하이퍼 링크는 상태에 따라서 색상이 바뀐다.
   1) 링크 텍스트의 초기 색상 - 밑줄과 함께 blue
   2) 방문 후 링크의 색 - purple
   3) 마우스로 링크를 클릭한 순간 - red
2. 링크 색 변경은 css를 통해 변경할 수 있다.
   1) 태그명:link - 모든 태그에 적용시 선택자로 처리
   2) #아이디명:link - id명으로 지정된 내용을 적용시 선택자로 처리
   3) .class:link - class명으로 지정된 내용을 적용시 선택자로 처리

a:link{		//a 태그 전체 변경
	color : pink;
    font-size : 20px;
    text-decoration : none;	 //default로 설정된 밑줄 선 제거
}
#css01:visited{		//id를 css01로 지정한 태그만 변경
	color : orange;
}
#css01:active{
	color : tomato;
}
<li><a href="/a01_start/a13_list.html">내부페이지</a></li>
<li><a id="css01" href="/a01_start/a13_list.html">내부페이지</a></li>