하이퍼 링크 태그 - 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 태그 사이에 이미지태그를 넣어 이미지에 하이퍼링크를 연결했다.
'WEB > HTML' 카테고리의 다른 글
HTML input 태그 : form / input / label / select / textarea (1) | 2022.05.27 |
---|---|
HTML 표(Table) 만들기 - table, tr, th, td 태그 (1) | 2022.05.26 |
하이퍼링크로 북마크 연결하기 (2) | 2022.05.25 |
절대경로, 상대경로 / 이미지, 비디오, 오디오 삽입 태그 (0) | 2022.05.25 |
HTML 샘플 / 텍스트 태그 / 목록 태그 (li, ul, ol) (1) | 2022.05.25 |