14.XHTML- 하이퍼링크

Godffs 2009. 7. 27. 08:58

Microsoft Visual Web Developer 2008 Express Edition 와 파이어폭스 설치
Microsoft Visual Web Developer 2008 Express Edition, 파이어폭스 사용

하이퍼링크(Hyperlink)는 글자, 그림, 파일등의 특정 위치에 연결시키는 것으로
하이퍼 텍스트의 핵심 개념입니다.
태그는 <A>입니다. 글자의 속성을 제어, 링크와 착갈피 기능을 수행합니다.

<a태그의 속성>
속성	인자	표현	설명
href	연결할 페이지 지정	예) <a href="http://~~"</a>	클릭하면 지정된 페이로 이동
target	_blank _parent _self _top 지정된 프레임	예) <a href="경로" target="_blank">링크</a>	인자의 속성에 따라서 새로 열기, 기존창에 열기등이 된다.
name	임의 이름	예) <a name="a" ></a>	임의로 정한 이름으로 프레임설정에서 사용된다. (프레임설정강좌-??참고)

하이퍼링크 (절대경로)

해당 페이지로 이동하는 방법입니다. 클릭시 현재 페이지에서 바로 이동하게 됩니다.

이번에는 새 창을 띄우고 지정된 경로를 보여주도록 하는 방법입니다.
<a href="http://godffs.tistory.com" target="_blank">준철이 블로그</a>

책갈피 (목적지 이동)

책갈피는 사용자가 이름을 지정하여 문서내에서 이동이 가능하게 됩니다.

▷ 페이지 이동이 아닌 스크롤 이동입니다.◁
먼저 이름을 지정합니다. 여기서 저는 이름을 "Charpter1" 로 하겠습니다.

1. 클릭시 지정한 곳으로 이동해야 합니다. 그럼 먼저 실행 시 이동 할 곳을 지정합니다.

저는 줄바꿈태그 태그를 20개 정도 연속적으로 사용해서 20여줄을 내린후에
 ......
<a name="Charpter1">Chapter1. 안녕하세요.</a>
클릭시 하단 부분에 있는 "Charpter1.안녕하세요."가 있는 곳까지 이동 하는 소스 입니다.

2. 이제 어떤걸 클릭 할때 1에서 작성한 "Charpter1.안녕하세요"가 있는 문장까지
이동 할 것인지 지정해야 합니다.

<a href="#Charpter1">1장으로 이동(내부경로)</a>
▷여기서 "#"을 붙인것은 책갈피 입니다.◁

상대 경로가 있습니다.
위에 책갈피에서는 지정된 곳으로 스크롤이동 시키는것이라는 상대경로는 개발자가 작업한 파일의 경로를 지정해 주는것으로 사용자가 쉽게 접근 할 수 없다고 보시면 될 것 같습니다.
(절대경로는 주소를 알고 있는 사람이면 어디든지 접속이 가능합니다.)

<a href="11.목록 htm">11.목록으로 이동(상대경로)</a>

14장.zip

해당파일 압축 푸신 후 14.하이퍼링크.htm 를 실행 해 주세요.