Front-End/HTML

[HTML] Ex05_앵커태그.html

이뮨01 2023. 6. 10. 15:15

텍스트나 이미지를 클릭했을 때 특정위치 or 페이지로 이동시켜 주는 앵커태그를 배우다.


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 앵커태그: 하이퍼링크를 만들 때 사용하는 태그
                  텍스트나 이미지를 클릭했을 때 특정위치 
                  또는 페이지로 이동시켜주는 태그
        href 속성: 이동한 특정위치나 페이지 경로 정의 -->
    <a href="https://www.naver.com">네이버</a>
    <a href="https://www.naver.com">
        <img src="https://mir-s3-cdn-cf.behance.net/project_modules/1400/3393f738210507.575900b317fb4.png" alt="" width="150" height="100">
    </a>
    <!-- 내부 페이지로 이동 -->
    <a href="./Ex04_이미지태그.html">Ex04_이미지 태그 페이지로 이동</a>
    <h1 id="top">상단</h1>
<!-- #: id 속성을 의미함 -->
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <a href="#top">상단으로 이동</a>
    
    

</body>
</html>

 

결과

href(Hypertext reference) 속성에 특정 위치나 페이지 경로를 정의한다.