상현
개발 덕후

Anchor (mailto, tel …)

( 업데이트: )

a 태그의 href 속성에 링크말고도 여러가지 기능을 사용할 수 있다. 알고는있지만 자주 찾게되는 것들을 기록해두려한다.

Mailto

href속성 접두사로 mailto:를 사용하면 컴퓨터에 기본적으로 설정된 이메일 클라인언트로 바로 이메일을 보내는 기능으로 사용가능하다.

default

<a href="mailto:dandan9509@gmail.com">Send</a>Code language: HTML, XML (xml)

참조 및 숨은 참조

참조받는 주소를 추가하고자 할 땐 cc를 추가한다. 숨은 참조를 위해서는 bcc를 추가한다.

<a href="mailto:dandan9509@gmail.com?cc=hyeon@hapas.io&bcc=admin@hapas.io">Send</a>Code language: HTML, XML (xml)

제목과 내용

제목을 추가할 땐 subject로 추가하고, 본문 내용을 추가할 땐 body로 추가한다.

미리 보내는 템플릿을 만들수있어서 유용하게 사용할 수 있다. 마치 깃헙의 이슈 템플릿처럼?

<a href="mailto:dandan9509@gmail.com?subject=제목&body=본문 내용">Send</a>Code language: HTML, XML (xml)

본문 내용의 줄바꿈은 %0D%0A를 사용하면 줄바꿈이 가능하다.

tel

<a href="tel:010-9999-9999">010-9999-9999</a>Code language: HTML, XML (xml)

tel은 따로 추가적인 기능은없고 봇이 링크를 타고 들어가지않게 방지하는 rel="nofollow"같은 속성을 사용할 수 있다.

IOS에서는 숫자를 감지하는데 IOS가 전화 번호를 자동으로 감지하지 못하도록 아래와 같이 설정할 수 있다.

<meta name="format-detection" content="telephone=no">Code language: HTML, XML (xml)

참고