[HTML] <a> tag

a 태그

<a></a> 태그는 하이퍼링크를 걸어주는 태그다.

속성

href: 클릭시 이동 할 링크
target: 링크를 여는 방법
_self: 링크를 현재 페이지에서 오픈. (기본값)
_blank: 링크를 새로운 창 새로운 페이지에서 오픈.
_parent: 링크를 현재 프레임의 부모 프레임에서 오픈.
_top: 링크를 윈도우페이지에서 오픈. (최상위 페이지)
프레임이름: 직접 프레임이름을 명시하고, 명시한 프레임 이름이 있는 곳에서 오픈.

사용방법

<a href="http://bottlesun.pe.kr" target="_blank">링크 열기</a>

a태그의 href를 사용하고 싶지 않을때,

href속성을 사용하지 않고 onClick() 이벤트를 사용하거나, 디자인적으로 사용하기 위함이다.

그럴때 유용히 쓰는 방법이 href= "" 값에 특정 값을 넣어주는 방법이다.

01. # 해시(hash)

# 해시(hash)라고 부르는 # 값이다. 퍼블리셔나 웹디자이너들이 HTML 마크업을 할때, 임의로 넣을경우 많이 사용 된다.

<a href="#">링크 열기</a>

id를 부를때 사용 되며, 빈 # 를 기입했을때, 링크로 이동을 하지는 않지만 윈도우에 최상단으로 이동 되는 특징이 있다.

02. #none (임의로 아이디값 넣기)

# 는 html 코드에서 id를 부를때 사용 되기에, 해당 부분에 사용하지 않는 빈 아이디 값을 넣어준다면, 링크로 이동 되지도 스크롤 이동도 되지 않는다.

<a href="#none">링크 열기</a>

03. javascript:void(0)

JavaScript에서 사용되는 코드로 void(0)는 undefined 을 반환한다.
링크 값에 undefined 을 반환하여 href의 기능을 없애기 위함이다.

<a href="javascript:void(0)">링크 열기</a>

○ # 해시(hash) 사용의 문제점

디자인 적으로 href="" 를 사용 안하게 되는건 맞지만 url 주소에 # 나 #id 값이 출력이 되게 되어, 예쁘지가 않다.

javascript:void(0) 를 사용 하면 해당 문제를 해결 할 수있다. :)