웹/HTML

Hyperlink

 HyperText의 Hyper는 컴퓨터 용어로서 텍스트 등의 정보가 동일 선상에 있는 것이 아니라 다중으로 연결되어 있는 상태를 의미한다.

 

 이것은 HTML의 가장 중요한 특징인 link의 개념과 연결되는데 기존 문서나 텍스트의 선형성, 고정성의 제약에서 벗어나 사용자가 원하는 순서대로 원하는 정보를 취득할 수 있는 기능을 제공한다. 한 텍스트에서 다른 텍스트로 건너뛰어 읽을 수 있는 이 기능을 하이퍼링크(hyper link)라 한다.

 

 HTML link는 hyperlink를 의미하며 a(anchor) tag가 그 역할을 담당한다.

<!DOCTYPE html>
<html>
  <body>
    <a href="http://www.google.com">Visit google.com!</a>
  </body>
</html>

 

  1. href 어트리뷰트
    1. href 어트리뷰트는 이동하고자 하는 파일의 위치(경로)를 값으로 받는다.
    2. 절대 URL : 웹사이트 URL // href="http://www.example.com/default.html"
      상대 URL : 자신의 위치를 기준으로한 대상의 URL // href="html/default.html
      fragment identifier : 페이지 내의 특정 id를 갖는 요소에의 링크 // href="#top"
      메일 : mailto:
      script : href="javascript:alert('Hello');" 
      <!DOCTYPE html>
<html>
  <body>
    <a href="http://www.google.com">URL</a><br>
    <a href="html/my.html">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>
</html>​
  2. target 어트리뷰트
    1. target 어트리뷰트는 링크를 클릭했을 때 윈도우를 어떻게 오픈할 지를 지정한다.
    2. _self : 링크를 클릭했을 때 연결문서를 현재 윈도우에서 오픈한다.(기본값)
      _blank : 링크를 클릭했을 때 연결문서를 새로운 윈도우나 탭에서 오픈한다. 
      <!DOCTYPE html>
<html>
  <body>
    <a href="http://www.google.com" target="_blank">Visit google.com!</a>
  </body>
</html>​

 

 

'웹 > HTML' 카테고리의 다른 글

Multi media Tags  (0) 2021.07.21
List and Table tags  (0) 2021.07.21
텍스트 관련 태그  (0) 2021.07.20
기본 태그  (0) 2021.07.20
시맨틱 웹(Semantic Web)  (0) 2021.07.20

    티스토리툴바