본문 바로가기
HTML

HTML 링크걸기 같은 페이지, 외부 페이지

by PraoB 2023. 9. 4.
반응형

HTML에서 링크로 이동하는 태그는 <a> 태그를 사용할 수 있습니다. <a> 태그는 하이퍼링크를 만들어주는 태그로, href 속성에 이동하고자 하는 위치의 URL이나 파일 경로를 지정할 수 있습니다. 또한, name 속성을 이용하면 같은 페이지 내의 특정 위치로 이동할 수 있습니다.

 

HTML 링크걸기 예시


 <h2>HTML 링크 예제 </h2>
 <p> <a href="#section1">섹션 1로 이동하기 </a> </p>
 <p> <a href="#section2">섹션 2로 이동하기 </a> </p>
 <p> <a href="https://www.naver.com">네이버로 이동하기 </a> </p>
 <h3 id="section1">섹션 1 </h3>
 <p>이곳은 섹션 1입니다. </p>
 <h3 id="section2">섹션 2 </h3>
 <p>이곳은 섹션 2입니다. </p>

이 코드를 실행하면 아래와 같은 결과를 볼 수 있습니다.


HTML 링크 예제

섹션 1로 이동하기

섹션 2로 이동하기

네이버로 이동하기

섹션 1

이곳은 섹션 1입니다.

섹션 2

이곳은 섹션 2입니다.


첫 번째 링크를 클릭하면 섹션 1의 제목이 있는 위치로 스크롤 되고, 두 번째 링크를 클릭하면 섹션 2의 제목이 있는 위치로 스크롤 됩니다. 세 번째 링크를 클릭하면 네이버 홈페이지로 이동합니다.

 

이렇게 <a> 태그는 본문 안에서 이동하는 태그로 사용될 수 있습니다.

댓글