728x90
HTML에서의 하이퍼링크는 <a>태그를 사용하여 일어난다.
1. href
href는 이동하고자 하는 파일의 위치(경로)의 값을 받는다. 경로란 파일의 특정위치를 말한다.
href에 사용 가능한 값은 다음과 같다.
| 절대 URL | 웹사이트 URL (href="https://develop-historychosun.tistory.com/") |
| 상대 URL | 자신의 위치를 기준으로 한 대상의 URL (href="css/style.css") |
| fragment identifier | 페이지 내의 특정 id를 갖는 요소의 링크 (href="#") |
| 메일 | href="mailto:???@example.com" |
| script | href="javascript:alert('Hello');" |
<body>
<a href="https://develop-historychosun.tistory.com/">URL</a><br />
<a href="css/style.css">Local file</a><br />
<a href="file/my.pdf" download>Download file</a><br />
<a href="#">fragment identifier</a><br />
<a href="mailto:someone@example.com?Subject=Hello again">Send Mail</a><br />
<a href="javascript:alert('Hello');">Javascript</a>
</body>Local file
Download file
fragment identifier
Send Mail
Javascript
2. target
target은 링크를 클릭했을 때 윈도우를 어떻게 오픈할 지를 지정한다.
| _self | 링크를 클릭했을 때 현재 윈도우에서 오픈한다.(기본값) |
| _blank | 링크를 클릭했을 때 새 탭에서 오픈한다. |
<body>
<a href="https://develop-historychosun.tistory.com/"mtarget="_blank" rel="noopener noreferrer">Visit google.com!</a>
</body>target="_blank" 를 이용하여 외부 페이지를 오픈하는 경우 이동한 페이지에서 자바스크립트 코드를 사용해 악의적인 페이지로 리다이렉트할 수 있는 보안취약점이 있다고한다.
따라서 rel="noopener noreferrer"를 추가 해 피싱공격에 대비할 것을 권장한다.
728x90
'Web > HTML' 카테고리의 다른 글
| #6. 이미지 & 멀티미디어 (0) | 2023.02.27 |
|---|---|
| #5. List & Table (0) | 2023.02.24 |
| #3. 텍스트 관련 태그들 정리 (0) | 2023.02.24 |
| #2. head 요소의 여러가지 태그들 (0) | 2023.02.21 |
| #1. HTML의 기본 문법 (0) | 2023.02.21 |