개발을 하다보면 한 번쯤은 사용해봤을 a태그를 톺아보겠습니다!

1. a 태그 란?

태그는 하이퍼링크를 걸어주는 태그입니다.

• 하이퍼링크:하이퍼텍스트문서안에 모든 형식의 자료(동영상, 음악, 사진, 프로그램, 파일, 글..) 를 연결하고 가리킬 수 있는 참조 고리

2. 태그의 주요 속성

• href: 클릭시 이동할 링크

• target: 링크를 여는 방법
  _self: 현재 페이지 (기본값)
  _blank: 새 탭
  _parent: 부모 페이지로, iframe 환경에서 사용
  _top: 최상위 페이지로, iframe 환경에서 사용

  예를 들면 다음과 같이 사용할 수 있습니다.

  <a href="https://velog.io/@hyevvy/posts">HYEVVY VELOG</a>

3. 신기한 a태그 의 href

href에는 클릭시 이동할 링크를 적지만 추가로 tel이나 mailto를 적을 수 있습니다.

tel: url을 사용하는 전화번호
mailto: url을 사용하는 이메일 주소

<a href='tel:010-0000-0000'>모바일웹에서 바로 전화걸기</a>

이 경우 모바일 웹에서 바로 전화가 걸어집니다.

<a href="mailto:'hyevvy@test.com;">메일보내기</a>

이 경우는 hyevvy@test.com이 수신인으로 지정되어 메일 신규 화면이 열리게 됩니다.

이 외에도 추가로 여러 옵션을 넣을 수 있습니다.

<a href="mailto:'hyevvy@test.com?subject=혜삐;">메일보내기</a>

혜삐라는 제목으로 메일 화면이 열리게 됩니다.

<a href="mailto:'hyevvy@test.com?cc=hyevvy2@test.com;">메일보내기</a>

이 때는 cc로 hyevvy2@test.com이 걸리게 됩니다.

<a href="mailto:hyevvy@test.com?body=메일본문">메일보내기</a>

이 경우에는 본문 내용도 미리 지정 가능합니다.

출처
mdn web docs