문서를 연결하는 a태그

문서를 연결하는 a 태그 (href / title / target  속성) : 문서를 링크시키기 위해 사용하는 태그

<a>태그

- anchor '정박지' 또는 '닻'의 약자

- <a>태그는 혼자만 사용하지 않고 아래와 같은 속성과 함께 사용된다.

href 속성 : hypertext reference의 약자로, 연결할 주소를 지정하는 속성

절대 url

(Uniform Resource Locator의 약자로 '웹페이지 주소'라는 뜻)

<a href="http://prettywho.tistory.com">푸른하늘댁 은하수</a>

상대 url

dd(주로 같은 문서 안에서 링크를 만들 때)

<a href="index.html">index.html 페이지로 이동</a>

<a href="../index.html">index.html 페이지로 이동</a> : ../는 상위 레벨의 폴더를 말함

<a href="home/index.html">index.html 페이지로 이동</a> : home 폴더 안에 있는 index.html 문서

다른 형식의 url

ftp://

mailto:

file:

<a href="mailto:admin@daum.net">Contact me</a>

ID를 이용한 url

(특히 같은 문서 내에서 가리키는 id)

<div id="top">ID를 이용한 URL<div> 라고 ID를 미리 지정한 후 아래처럼 연결 시킨다.

<a href="#top">맨 위로 이동</a>

SCRIPT(스크립트)

<a href="javascript:alert('HELLO');">

title 속성

해당 링크에 마우스를 갖다 대면 link에 대한 설명이 나온다.

<a href="http://prettywho.tistory.com" title="my homepage">푸른하늘댁 은하수</a>

target 속성

링크를 클릭할 때 창을 어떻게 열 지 결정한다.

_self 연결 문서를 클릭한 창에서 엶(기본값)

_blank 연결 문서를 새 창에서 엶

_parent 부모(상위레벨)창에서 엶(부모가 없으면 _self처럼 표시함)

_top 가장 상위 창에서 엶(즉 프레임을 무시하며, 전체 브라우저 창에서)(부모가 없으면 _self처럼 표시됨)

frame name 지정된 프레임 안에 엶

<a href="http://prettywho.tistory.com" target="_blank">푸른하늘댁 은하수</a>

<a>태그는 문자뿐만 아니라 이미지, <div>등도 링크를 걸 수 있다.

<a href="http://prettywho.tistory.com"><img src="prettywho.png"/></a>

<a href="http://prettywho.tistory.com"><div id="divId">아이디클릭</a>

[출처] http://aboooks.tistory.com/category/html