하이퍼 링크 태그 - a

<a href = "이동할 페이지 경로" target = "출력위치"> 
 
href : 이동할 페이지 경로, 첨부파일 경로
target : 페이지 이동시 출력할 창
title : 툴팁 표시, 어떤 태그에서도 사용이 가능
download : 첨부파일 처럼 다운로드 설정
 
 

href

이동할 페이지 경로

 

절대경로, 상대경로 / 이미지, 비디오, 오디오 삽입 태그

이미지, 동영상(비디오), 오디오 삽입 태그 절대경로 / 상대경로 절대경로 root folder(최상위 폴더)를 기준, 고유한(절대적인) 경로로 접근하는 방법 상대경로 현재 파일을 기준으로 접근하는 방법

jinaon.tistory.com

 

target

_blank
링크로 연결된 문서를 새 창이나 새 탭에서 연다.
_self
링크로 연결된 문서를 현재 프레임에서 연다. (default)
_parent
링크로 연결된 문서를 부모 프레임에서 연다.
_top
링크로 연결된 문서를 현재 창의 가장 상위 프레임에서 연다.
frame 이름
링크로 연결된 문서를 지정된 프레임에서 연다.

 

 

<a href = "/Step01/person_info.html" target="_blank> person_info.html 페이지 이동 </a> <br>

새탭에서 열도록 지정했다.

 

 

<a href="/Step02/video/구름.mp4" target="view">동영상 링크</a>
    <hr>
    <iframe src="" frameborder="0" width="1280" height="640" name="view"></iframe>

iframe이름을 view로 지정했고, 하이퍼링크  target을 view로 지정했다.

하이퍼링크가 view 자리에 열린다.

 

 

 

download

<a href="/Step02/video/구름.mp4" download>동영상 파일</a>

download 속성 넣으면, 링크 클릭시 첨부파일로 동영상이 다운로드 된다.

 

 

title

<a href="/Step02/video.html" target="_blank" title="동영상 페이지 이동"> 비디오 파일로 이동</a>

링크에 마우스를 대면 "동영상 페이지 이동" 이라는 툴팁이 표시된다.

 

 

<body>
    <a href = "/Step01/person_info.html"> person_info.html 페이지 이동 </a> <br>
    <a href="/Step02/video.html" target="_blank" title="동영상 페이지 이동"> 비디오 파일로 이동</a><br>
    <a href="/Step02/img/cat.jpg">이미지 링크</a><br>
    <a href="/tag_list.txt"> 텍스트 파일</a><br>
    <a href="/Step02/video/구름.mp4" download>동영상 파일</a>
</body>

html, 이미지, 텍스트, 동영상 파일로 이동할 수 있는 하이퍼링크를 만들었다.

 

 

 

 <a href="/Step02/img/cat.jpg">
        <img src="/Step02/img/cat.jpg" width="100">
    </a>

 

하이퍼링크는 글씨 외의 것들에도 걸 수가 있다. a 태그 사이에 이미지태그를 넣어 이미지에 하이퍼링크를 연결했다.