링크 Anchor

김무음·2023년 8월 20일
0

HTML & CSS

목록 보기
4/58
post-custom-banner

웹 사이트를 이용할 때 링크를 되게 많이 사용하는데 링크를 눌러 다른 페이지로 이동하거나, 다른 부분으로 이동할 때도 a태그를 사용 할 수 있다.
따라서, 현 위치에서 다른 위치로 이동.

Syntax 문법 주의

<a href>링크</a>

href는 뭘까? hypertext Reference의 의미로써 주소값으로 이동한다고 보면 된다. 생각해보면 a태그가 다른 곳으로 이동하는 태그인데 그러면 어디로 이동할지 작성해주면 된다. 꼭 적어주자!


href 주소 표기법

1. 웹 URL

<a href="https://naver.com">네이버로 이동</a>

2. 페이지 내 이동

<section id="hello">
	Lorem ipsum dolor, sit amet consectetur adipisicing elit. Minus a et porro
    itaque delectus repudiandae, asperiores, illum dolorum in dicta corrupti
    dolorem blanditiis eveniet odio sed eaque doloribus molestiae debitis.
</section>
<a href="#hello">id가 hello인 구역으로 이동</a>

3. 전화번호

<a href="tel:010-1234-5678">전화 걸기</a>

4. 메일주소

<a href="mailto:abc@naver.com">이메일 작성하기</a>

5. target

평소 a태그를 이용하면 그 페이지가 다른 페이지로 이동하지만 target="_blank"를 이용하면 새로운 탭을 만들어서 이동할 수 있다.

<a href="https://naver.com" target="_blank">이메일 작성하기</a>
profile
오늘도 한 발자국 더 나아가.
post-custom-banner

0개의 댓글