[HTML] 링크

다른 페이지로 이동하기 위한 링크걸기

- a태그를 이용하기

- 자바스크립트 이용하기

 

a(anchor) tag

<a href="http://naver.com">네이버로 가기</a> <br>

- a 태그는 전체 글의 일부분에만 링크를 걸 수 있도록 되어있는 태그다. (영역을 따로 설정하는 태그가 아니다.)

- href 속성에는 가고싶은 목적지의 url을 설정해 놓는다.

- 절대경로와 상대경로를 모두 사용할 수 있다.

 

JavaScript로 링크 걸기

- location : 현재 브라우저가 보고 있는 페이지 위치에 대한 정보 인스턴스

- href : 현재 브라우저가 보고 있는 페이지의 경로

 

<p>
   자세한 정보는 <button onclick="location.href='http://naver.com'">여기</button>에서 확인하세요!
</p>

 

URL 경로의 종류

    <p>
        - <a href="naver.com">naver.com</a> <br>
        - <a href="./naver.com">./naver.com</a> <br>
        - <a href="/naver.com">/naver.com</a> : 도메인부터 시작되는 경로 <br>
        - <a href="//naver.com">//naver.com</a> : 프로토콜부터 시작되는 경로 <br>
        - <a href="http://naver.com">http://naver.com</a> <br>
    </p>

 

내부 페이지로 링크 걸기

    <p>
        - <a href="./01_HTML은 무엇인가.html">HTML이란 무엇인가?</a> <br>
        - <a href="./02_제목과 문단.html">제목과 문단</a> <br>
        - <a href="./03_요소.html">요소</a> <br>
        - <a href="./04_속성.html">속성</a> <br>
    </p>

 

페이지의 특정 부분으로 링크 걸기

    <p>
        <a href="#chap01">chap01</a> <br>
        <a href="#chap02">chap02</a> <br>
        <a href="#chap03">chap03</a> <br>
        <a href="http://naver.com#feed">네이버의 특정 부분 가보기</a> <br>
    </p>

    <h1 id="chap01"># Chapter 1</h1>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <h1 id="chap02"># Chapter 2</h1>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <h1 id="chap03"># Chapter 3</h1>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>
    <p>Common sense is not so common</p>