여러분이 사용하고 계신 브라우저는 HTML5를 지원하지 않기 때문에 몇몇 요소가 제대로 보이도록 JScript를 사용하고 있습니다. 하지만 여러분의 브라우저 설정에서 스크립트 기능이 꺼져있으므로, 현재 페이지를 제대로 확인하시려면 스크립트 기능을 켜주셔야 합니다. A 요소 - 웹페이지, 전화, 문자 메시지, 메일 보내는 링크 거는 방법
A 요소 – 웹페이지, 전화, 문자 메시지, 메일 보내는 링크 거는 방법
6개월전 작성
6개월전 수정

<a>

A 요소로 웹페이지, 전화 거는 링크, 문자 메시지, 메일 보내는 링크를 걸 수 있다.

어떻게 하는지 알아보자.

형식
<a href="웹사이트 주소">링크할 텍스트 / 이미지</a>

위와 같이 사용하면 링크를 걸 수 있다.

자세히 알아보자.

웹사이트 링크 걸기

가장 기본적으로 가장 많이 사용 되는 A 요소로 링크 거는 방법이다.

예시
<a href="https://maz.kr/" target="_blank" title="Mingg's Diary로 가기">https://maz.kr</a>
기본 예시
https://maz.kr
A 태그의 속성
target
:
링크를 열 타겟을 지정한다. target=”_blank”: 새로운 창/탭에서 열기, target=”_self”: 현재 창에서 열기, target=”_parent”: 상위 프레임에서 열기, target=”_top”: 창 전체에서 열기
title
:
링크에 포인터를 가져가면 보여줄 설명

파일 다운로드 링크 걸기

파일을 다운로드 받는 링크를 만들 수 있다.

예시
<a href="https://www.w3schools.com/images/myw3schoolsimage.jpg" download><img src="https://www.w3schools.com/images/myw3schoolsimage.jpg" alt="다운로드 받을 이미지" title="이미지 다운로드" width="104" height="142"></a>
기본 예시
다운로드 받을 이미지
A 태그의 속성
download
:
download=”파일 이름”와 같이 파일 이름을 붙이면 다운로드 받은 파일의 이름이 ‘파일 이름’으로 변경되어 다운로드 된다.

전화 걸기 링크

전화를 걸 수 있는 링크를 만들 수 있다.

예시
<a href="tel:114">>114 전화 걸기</a>
기본 예시
114 전화 걸기
tel 태그의 속성
tel
:
tel:114, tel:010-0000-0000과 같이 전화번호를 입력하면 전화를 걸 수 있다.

SMS 보내기

요즘은 문자 메시지가 많이 사용되진 않지만 그래도 가끔 사용이 된다.

예시
<a href="sms:010-0000-0000">SMS 보내기</a>
sms 태그의 속성
sms
:
sms:010-0000-0000과 같이 전화번호를 입력하여 메시지를 발송할 수 있다.
Android 예시
<a href="sms:010-0000-0000?body=보낼 메시지 내용">Android SMS 보내기</a>
기본 예시

Android SMS 보내기

sms 태그의 속성
?body=보낼 메시지 내용
:
Android는 body 앞에 ?를 붙여서 보낼 메시지 내용을 지정할 수 있다.
iPhone 예시
SMS 보내기
<a href="sms:010-0000-0000&body=보낼 메시지 내용">iPhone SMS 보내기</a>
단체 SMS 보내기
<a href="sms:/open?addresses=010-0000-0001,010-0000-0002&body=보낼 메시지 내용">iPhone SMS 보내기</a>
sms 태그의 속성
&body=보낼 메시지 내용
:
iPhone은 body 앞에 &를 붙여서 보낼 메시지 내용을 지정할 수 있다.
/open?addresses=010-0000-0001,010-0000-0002″
:
iPhone은 이와 같이 여러 번호로 단체 문자를 보낼 수 있다.

메일 보내기

메일을 보내는 링크를 만들어보자.

예시
메일 보내기
<a href="mailto:someone@example.com">메일 보내기</a>
메일 제목 넣어 보내기
<a href="mailto:someone@example.com?subject=안녕하세요.">메일 제목 넣어 보내기</a>
참조 넣기
<a href="mailto:someone@example.com?cc=someone@test.com">참조 넣어 메일 보내기</a>
숨은 참조 넣기
<a href="mailto:someone@example.com?bcc=someone@test.com">숨은 참조 넣어 메일 보내기</a>
본문 추가하기
<a href="mailto:someone@example.com?body=안녕하세요.">본문 추가하여 메일 보내기</a>
본문에 줄바꿈 추가하기
<a href="mailto:someone@example.com?body=안녕하세요.%0D%0A밍구 입니다.">본문에 줄바꿈 추가하여 메일 보내기</a>
여러가지 추가하기
<a href="mailto:someone@example.com?subject=안녕하세요.&body=안녕하세요.%0D%0A밍구 입니다.">여러가지 추가해서 메일 보내기</a>
mailto 태그의 속성
?
:
메일 주소 뒤에는 ?를 붙인다.
&
:
여러가지를 미리 지정하고 싶을 때 &를 사용한다.
subject
:
subject=메일 제목을 넣을 수 있다.
cc
:
cc=메일주소로 참조를 넣을 수 있다.
bcc
:
bcc=메일주소로 숨은 참조를 넣을 수 있다.
body
:
body=본문내용으로 본문내용을 추가할 수 있다.
%0D%0A
:
본문내용 중 줄바꿈이 필요할 때 사용한다.
참고

Mingg`s Diary
밍구
공부 목적 블로그