프론트엔드/HTML

Tag - 링크 관련

ksge7 2020. 8. 19. 16:11

링크 만들기

<body>
<a href=""> 링크 </a>
</body>

HTML에서 문서 간 이동할 수 있는 링크를 만들기 위해선 <a> 태그를 이용하면 된다.

 

링크에 속성값 주기

<body>

<a href=""> 링크 </a>

<a href="주소" target="_blank"> 링크 </a>

<a href="주소" target="_self"> 링크 </a>

<a href="주소" target="_parent"> 링크 </a>

<a href="주소" target="_top"> 링크 </a>

</body>

<a>에 'target' 속성을 부여할 수 있다.

 

_blank

링크 내용이 새 창이나 새 탭에서 열림

_self

target  속성의 기본 값으로 링크가 있는 화면에서 열림

_parent

프레임을 사용했을 때 내용을 부모 프레임에 표시

_top

프레임을 사용시 프레임에서 벗어나 링크 내용을 전체에 표시

 

추가적으로 <a> 태그의 'href' 속성의 값으로 페이지 주소만 들어가는 것이 아니다.

 

예를 들어 값으로 해당 웹페이지 내 아이디 값 등을 속성값으로 준다면 해당 링크를 눌렀을 때 그 아이디를 속성값으로 가지는 웹페이지 위치로 이동한다.

 

실제 예를 들면 홈페이지 같은데서 위로 가기 버튼 누르면 맨 상단으로 자동 스크롤 이동이 되는 것을 떠올리면 편하다.