[html/css]문서를 연결하는 a 태그 (href, title, target 속성)

 

 

[html/css]문서를 연결하는 a 태그 (href, title, target 속성)

 

 

인터넷을 사용할 때 가장 많이 보는 것 중 하나가 이 링크인데요.

 

링크를 통해 다른 웹페이지로 이동하거나, 문서 내에서도 이동할 수가 있습니다.

 

이렇게 문서를 링크시키기 위해 사용하는 태그가 바로 <a>태그 입니다.

 

 

<a>태그

 

anchor '정박지' 또는 '닻 '의 약자입니다

 

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

 

 

herf 속성

hypertext reference 약자로,  연결할 주소를 지정하는 속성입니다.

 

 

사용 예 :

 

<a href="http://aboooks.tistory.com">지구별 안내서 바로가기</a>

따옴표(" ")를 빠트리지 않도록 주의해 주세요. 링크가 정상적으로 나오지 않을 수도 있습니다~

 

 

 

 

주소는 아래처럼 다양하게 넣을 수 있습니다

 

절대 URL (Uniform Resource Locator의 약자로 '웹페이지 주소'라는 뜻)   <a href="http://aboooks.tistory.com">지구별 안내서</a>   상대 URL(주로 같은 문서 안에서 링크를 만들 때) <a href="right.htm">오른쪽 페이지로 이동</a>   <a href="../right.htm">오른쪽 페이지로 이동</a> ../ 는 상위 레벨의 폴더를 말함.   <a href="home/right.htm">오른쪽 페이지로 이동</a> [home]폴더 안에 있는 right.htm문서를 가리킴     다른 형식의 URL   ftp:// mailto: file:   예 : <a href="mailto:abooks@daum.net">Contact me</a>   id를 이용한 URL  (특히 같은 문서 내에서 가리키는 id)    예: <div id="top">ID를 이용한 URL</div> 라고 ID를 미리 지정한 후 아래처럼 연결시킴.        <a herf="#top">맨 위로 이동</a>    또는 <a href="http://aboooks.tistory.com/87#top">맨 위로 이동</a>   [HTML, CSS 기초] class, id 선택자 참조       스크립트 <a href="javascript:alert('Hello');">

 

 

 

title 속성

 

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

 

사용 예: <a href="http://aboooks.tistory.com/"  title="my homepage">지구별 안내서</a>

 

 

 

 

target 속성

 

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

 

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

_blank  연결 문서를 새 창에서 엶
_parent 부모(상위 레벨) 창에서 엶(부모가 없으면 _self처럼 표시함)
_top  가장 상위 창에서 엶(즉 프레임을 무시하며, 전체 브라우저 창에서)(부모가 없으면 _self처럼 표시됨)
frame name 지정된 프레임 안에 염.

 

사용 예 : <a href=http://aboooks.tistory.com" target="_blank">지구별 안내서 바로가기</a>

 

 

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

 

사용 예 :

<a href="http://aboooks.tistory.com"><img src="main.png" /></a>
<a href="http://aboooks.tistory.com"><div id="a">애국가</div></a> 

 

 

  

[html/css] a: link, a: visited, a: active, a: hover 사용법 자세히 알기

 

[html기초]  , br, pre, p 태그

 

 table 태그, tr 태그, th 태그, td 태그와 table 속성 정리