하이퍼 링크 관련 태그

• 하이퍼 링크 관련 태그 : a (anchor) 태그
  - a 태그는 현재 HTML 문서와 다른 HTML 문서를 연결해서 페이지 이동을 할 수 있게 하는 기능을 제공
    → 이 때, a 태그로 감싸진 문자열 == 하이퍼 링크
  
  
• a 태그를 이용한 하이퍼 링크 구현

    <ul>
        <li>
            <a href="">글자 관련 태그</a>
        </li>
        <li>
            <!-- target 속성 : 연결된 문서를 어디에서 열 것인지 지정하는 속성
                        기본값 : 같은 탭 
                        _blank : 비어있는 탭 == 새 탭
            -->
            <a href="" target="_blank">목록 관련 태그</a>
        </li>
        <li>
            <a href="https://www.naver.com" target="_blank">네이버로 이동</a>
        </li>
    </ul>

---

• 이미지 클릭 시 페이지 이동

<a href="https://www.google.com/"><img src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png"></a>

---

• 한 페이지 내에서 점프하기

    <ul id="list">
        <li><a href="#cat1">고양이 1</a></li>
        <li><a href="#cat2">고양이 2</a></li>
        <li><a href="#cat3">고양이 3</a></li>
    </ul>

    <h3 id="cat1">고양이 1</h3>
    <img src="../images/cats/cat1.jpg"><br>
    <a href="#list">목록으로 이동</a>

    <h3 id="cat2">고양이 2</h3>
    <img src="../images/cats/cat2.jpg"><br>
    <a href="#list">목록으로 이동</a>

    <h3 id="cat3">고양이 3</h3>
    <img src="../images/cats/cat3.jpg"><br>
    <a href="#list">목록으로 이동</a>

"고양이 1" 클릭 시 고양이 1 이미지로 이동 / "목록으로 이동" 클릭 시 상단 목록으로 이동