Hyperlink(HTML5Tag - Link)

sssuin·2021년 5월 26일
0

html

목록 보기
5/9
  • Hyper Textdml Hyper는 텍스트 등의 정보가 다중으로 연결되어 있는 상태를 의미
  • 사용자가 원하는 순서대로 원하는 정보를 취득할 수 있는 기능을 제공
  • 하이퍼링크(Hyper link): 한 텍스트에서 다른 텍스트로 건너뛰어 읽을 수 있는 기능
  • HTML link = hyperlink = a(anchor) tag가 그 역할
    <a href=“주소”> </a>

1. Href attribute

: 이동하고자 하는 파일의 위치(경로)를 값으로 함

(1)디렉토리(Directory)

: 파일과 다른 디렉토리를 갖는 파일 시스템 내의 존재물(폴더)

1)루트 디렉토리
: 파일 시스템 계층 구조 상 최상위 디렉토리

  • unix:/
  • windows: C:\

2)홈 디렉토리
: 시스템의 사용자에게 각각 할당된 개별 디렉토리

  • uniw: /User/{계정명}
  • windows: c\Users\{계정명}

3)작업 디렉토리
: 작업중인 파일이 위치한 디렉토리

  • ./

4)부모 디렉토리
: 작업 디렉토리의 부모 디렉토리

  • ../

(2)파일 경로(File path)

: 파일 시스템에서 파일의 위치를 나타내는 방법

1)절대경로(Absolute path)
: 현재 작업 디렉토리와 관계없이 특정 파일의 절대적인 위치를 가리킴. 루트 디렉터리 기준으로 파일의 위치 나타냄

2)상대경로(Relative path)
: 현재 작업 디렉토리를 기준으로 특정 파일의 상대적이 위치 가리킴(현재 위치에서 해당 파일로 가는 주소)

  • ./index.html
  • ../dist/index.js
  • index.html
  • html/index.html

-> href attribute에 사용 가능한 값

  • 절대 URL: 웹사이트 URL (https://poiemaweb.com/html5-tag-link)
  • 상대 URL: 자신의 위치를 기준으로 한 대상의 URL(href=“html/default.html”)
  • fragment indentifier: 페이지 내 특정 id를 갖는 요소에 링크(href=“#top”)
  • 메일: mailto:
  • script: href=“javascript: alert(‘Hello’);”

2.Target attribute

: 링크를 클릭했을때 윈도우를 어떻게 오픈할지 지정

(1) <a href=“주소” target=“_self”> </a> 링크 클릭했을때 연결문서를 현재 윈도우에서 오픈(기본값)
(2) <a href=“주소” target=“_blank> </a> 링크를 클릭했을때 연결문서를 새로운 페이지에서 오픈

참고

0개의 댓글