하이퍼 링크는 클릭하여 다른 문서로 이동할 수 있습니다.
링크는 텍스트 일 필요는 없습니다.
이미지 또는 다른 HTML 요소가 될 수 있습니다.
하이퍼 링크는 <a> 태그로 정의합니다.
href 속성에 링크의 주소를 지정합니다.
<a> 요소의 콘텐츠를 클릭하면 주소로 이동합니다.
target 속성은 링크된 문서를 여는 위치를 지정할 수 있습니다.
| 속성값 | 설명 |
|---|---|
| _blank | 새창에서 링크된 문서를 엽니다. |
| _self | (기본값) 현재 창에서 링크된 문서를 엽니다. |
| _parent | 링크된 문서의 부모 프레임에서 엽니다. |
| _top | 창 전체에서 링크된 문서를 엽니다.(프레임이 있을 경우 모든 프레임이 제거하고 문서가 열립니다.) |
| 프레임명 | 지정된 프레임에서 링크된 문서를 엽니다. |
HTML 북마크는 사용자가 웹페이지의 특정부분으로 이동할 수 있게 하는데 사용합니다.
웹 페이지의 내용이 너무 길면 북마크가 유용할 수 있습니다.
북마크는 HTML 요소에 id 속성을 지정하고 <a> 요소의 href 속성으로 지정합니다.
<a> 요소의 href 속성을 이용하여 다양한 링크를 설정할 수 있습니다.
| mailto: | 지정된 이메일 주소로 메일을 보냅니다.(메일이 설치되어 있어야 합니다) |
| javascript: | 지정된 JavaScript 코드를 실행합니다. |
| tel: | 지정된 전화번호로 전화를 겁니다.(전화가 설치되어 있어야 합니다) |
| 파일 |
파일도 링크의 대상으로 지정할 수 있습니다. |
<a href="mailto:moosin76@naver.com">moosin76@naver.com으로 메일을 보냅니다.</a>
<a href="javascript:alert('알림창');">javascript 코드를 실행합니다.</a>
<a href="tel:010-1111-2222">전화를 겁니다.</a>
download 속성은 사용자가 하이퍼 링크를 클릭할 때 대상이 다운로드 되도록 지정합니다.
값을 지정하지 않으면 원래의 이름을 사용합니다.
<a href="sample.jpg" download>sample.jpg 파일을 다운로드 합니다.</a>
<a href="logo.png" download="ezcode">logo.png 파일을 ezcode.png 이름으로 다운로드 합니다.</a>