[HTML] a 태그 내부링크 설정하기

-
a 태그를 통해 만들어진 링크는 무조건 외부 페이지로만 이동하는것은 아니다.

a 태그를 사용하여 페이지 내부의 특정 요소로 이동할 수 있는데 이를 내부 링크라고 한다.

내부링크는 사용할 때 href 속성값으로 #을 작성하고 그뒤에 이동하고자하는 요소의 id 속성 값을 작성한다.

 <html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>

<body>
<!-- 링크를 클릭하면 href 속성에 #과 같이 작성된 값과
동일한 id 값을 가진 태그로 이동한다. -->
<a href="#1">1번 내용으로 이동</a>
<a href="#2">2번 내용으로 이동</a>
<a href="#3">3번 내용으로 이동</a>
<a href="#4">4번 내용으로 이동</a>
<a href="#5">5번 내용으로 이동</a>


<h1 id='1'>1번</h1>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Reprehenderit libero est itaque modi in et laudantium
ratione eligendi, architecto autem veniam necessitatibus id, dolores odio maiores commodi distinctio voluptate,
molestiae reiciendis. Praesentium ratione sed error voluptas eligendi neque dicta possimus molestiae atque. Ad
quae harum sed, officiis assumenda, consequatur voluptatum corrupti facere aliquid repellendus nemo reiciendis,
consectetur enim alias dolor esse illo? Ullam quaerat corporis animi incidunt eligendi rem ipsa dolor voluptates
recusandae repudiandae inventore magnam nostrum vero consectetur amet a commodi architecto, est illum magni
beatae dicta ipsam aliquam cum. Illo esse minus ad dignissimos error iure labore minima aliquid magnam ut a
eaque, placeat ipsam eum officia voluptates voluptatem rem eius illum? Aperiam ipsam atque et incidunt
provident, ipsum architecto quo repellendus, exercitationem illo ab mollitia, dicta sunt odio suscipit
assumenda. Ut repudiandae ea sed dolorum iure tempore repellat minima enim, ducimus voluptas modi odit mollitia
molestiae impedit, incidunt debitis nisi quisquam vero necessitatibus quis aliquam harum. Cupiditate, vitae vel
eaque ea assumenda odio dolorem expedita quisquam laboriosam perferendis magnam, libero numquam eos labore!
Consectetur consequatur voluptatibus obcaecati ducimus libero quis dolore animi ipsam tempora, sapiente aperiam
dolorum mollitia laborum reiciendis? Neque quasi numquam voluptates tenetur ad veritatis molestiae sit tempora
eius, eligendi sed dolores in impedit commodi ab ullam dolor quod perspiciatis, atque facere dolore voluptatum
ut error? Optio vero repudiandae minima tempore labore magnam earum molestias, laboriosam mollitia tempora
commodi non natus, quia quae consequuntur voluptatem! Repellat magni quas quam non consequuntur fugiat et soluta
maxime? Veritatis beatae natus cupiditate sunt dicta? Dolore, reiciendis vel. Voluptatibus praesentium suscipit
optio ipsa, facilis tempore iure temporibus facere harum incidunt soluta accusamus at ipsum sapiente commodi!
Consequatur blanditiis deleniti cupiditate ullam, cum numquam quis? Iste neque optio, magni molestiae sunt
</p>
<h1 id='2'>2번</h1>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Reprehenderit libero est itaque modi in et laudantium
ratione eligendi, architecto autem veniam necessitatibus id, dolores odio maiores commodi distinctio voluptate,
molestiae reiciendis. Praesentium ratione sed error voluptas eligendi neque dicta possimus molestiae atque. Ad
quae harum sed, officiis assumenda, consequatur voluptatum corrupti facere aliquid repellendus nemo reiciendis,
consectetur enim alias dolor esse illo? Ullam quaerat corporis animi incidunt eligendi rem ipsa dolor voluptates
recusandae repudiandae inventore magnam nostrum vero consectetur amet a commodi architecto, est illum magni
beatae dicta ipsam aliquam cum. Illo esse minus ad dignissimos error iure labore minima aliquid magnam ut a
eaque, placeat ipsam eum officia voluptates voluptatem rem eius illum? Aperiam ipsam atque et incidunt
provident, ipsum architecto quo repellendus, exercitationem illo ab mollitia, dicta sunt odio suscipit
assumenda. Ut repudiandae ea sed dolorum iure tempore repellat minima enim, ducimus voluptas modi odit mollitia
molestiae impedit, incidunt debitis nisi quisquam vero necessitatibus quis aliquam harum. Cupiditate, vitae vel
eaque ea assumenda odio dolorem expedita quisquam laboriosam perferendis magnam, libero numquam eos labore!
Consectetur consequatur voluptatibus obcaecati ducimus libero quis dolore animi ipsam tempora, sapiente aperiam
dolorum mollitia laborum reiciendis? Neque quasi numquam voluptates tenetur ad veritatis molestiae sit tempora
eius, eligendi sed dolores in impedit commodi ab ullam dolor quod perspiciatis, atque facere dolore voluptatum
ut error? Optio vero repudiandae minima tempore labore magnam earum molestias, laboriosam mollitia tempora
commodi non natus, quia quae consequuntur voluptatem! Repellat magni quas quam non consequuntur fugiat et soluta
maxime? Veritatis beatae natus cupiditate sunt dicta? Dolore, reiciendis vel. Voluptatibus praesentium suscipit
optio ipsa, facilis tempore iure temporibus facere harum incidunt soluta accusamus at ipsum sapiente commodi!
Consequatur blanditiis deleniti cupiditate ullam, cum numquam quis? Iste neque optio, magni molestiae sunt
voluptate eos cum? Fugit obcaecati sapiente facilis ipsam quaerat deleniti nihil numquam sequi placeat. Ab quod
error iusto dolores. Voluptas pariatur et rem beatae fuga modi quam ratione quisquam natus dolore numquam,

</p>
<h1 id='3'>3번</h1>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Reprehenderit libero est itaque modi in et laudantium
ratione eligendi, architecto autem veniam necessitatibus id, dolores odio maiores commodi distinctio voluptate,
molestiae reiciendis. Praesentium ratione sed error voluptas eligendi neque dicta possimus molestiae atque. Ad
quae harum sed, officiis assumenda, consequatur voluptatum corrupti facere aliquid repellendus nemo reiciendis,
consectetur enim alias dolor esse illo? Ullam quaerat corporis animi incidunt eligendi rem ipsa dolor voluptates
recusandae repudiandae inventore magnam nostrum vero consectetur amet a commodi architecto, est illum magni
beatae dicta ipsam aliquam cum. Illo esse minus ad dignissimos error iure labore minima aliquid magnam ut a
eaque, placeat ipsam eum officia voluptates voluptatem rem eius illum? Aperiam ipsam atque et incidunt
provident, ipsum architecto quo repellendus, exercitationem illo ab mollitia, dicta sunt odio suscipit
assumenda. Ut repudiandae ea sed dolorum iure tempore repellat minima enim, ducimus voluptas modi odit mollitia
molestiae impedit, incidunt debitis nisi quisquam vero necessitatibus quis aliquam harum. Cupiditate, vitae vel
eaque ea assumenda odio dolorem expedita quisquam laboriosam perferendis magnam, libero numquam eos labore!
Consectetur consequatur voluptatibus obcaecati ducimus libero quis dolore animi ipsam tempora, sapiente aperiam
dolorum mollitia laborum reiciendis? Neque quasi numquam voluptates tenetur ad veritatis molestiae sit tempora
eius, eligendi sed dolores in impedit commodi ab ullam dolor quod perspiciatis, atque facere dolore voluptatum
ut error? Optio vero repudiandae minima tempore labore magnam earum molestias, laboriosam mollitia tempora
commodi non natus, quia quae consequuntur voluptatem! Repellat magni quas quam non consequuntur fugiat et soluta
maxime? Veritatis beatae natus cupiditate sunt dicta? Dolore, reiciendis vel. Voluptatibus praesentium suscipit
optio ipsa, facilis tempore iure temporibus facere harum incidunt soluta accusamus at ipsum sapiente commodi!
Consequatur blanditiis deleniti cupiditate ullam, cum numquam quis? Iste neque optio, magni molestiae sunt
voluptate eos cum? Fugit obcaecati sapiente facilis ipsam quaerat deleniti nihil numquam sequi placeat. Ab quod
error iusto dolores. Voluptas pariatur et rem beatae fuga modi quam ratione quisquam natus dolore numquam,

</p>
<h1 id='4'>4번</h1>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Reprehenderit libero est itaque modi in et laudantium
ratione eligendi, architecto autem veniam necessitatibus id, dolores odio maiores commodi distinctio voluptate,
molestiae reiciendis. Praesentium ratione sed error voluptas eligendi neque dicta possimus molestiae atque. Ad
quae harum sed, officiis assumenda, consequatur voluptatum corrupti facere aliquid repellendus nemo reiciendis,
consectetur enim alias dolor esse illo? Ullam quaerat corporis animi incidunt eligendi rem ipsa dolor voluptates
recusandae repudiandae inventore magnam nostrum vero consectetur amet a commodi architecto, est illum magni
beatae dicta ipsam aliquam cum. Illo esse minus ad dignissimos error iure labore minima aliquid magnam ut a
eaque, placeat ipsam eum officia voluptates voluptatem rem eius illum? Aperiam ipsam atque et incidunt
consequuntur suscipit quaerat labore fugiat adipisci. Natus quos sint quibusdam blanditiis vero culpa rem
nam odit non asperiores neque, voluptatibus ut impedit assumenda molestias aliquid rerum illum explicabo
provident! Neque doloremque dolorum hic corporis minus, ex similique in eaque et repellat consequuntur iurem
possimus atque explicabo aspernatur excepturi corrupti cupiditate provident minus placeat maiores, iusto
laboriosam iste aut, totam beatae hic, rem ipsum quia? Veritatis amet dolore iusto animi earum, iste inventore
recusandae reiciendis? Repellendus quod explicabo rerum? A quaerat modi alias placeat quisquam et facilis quis
maxime corrupti iure, voluptate sed quos, exercitationem quis laboriosam cumque numquam eum aliquam earum
doloribus quae reprehenderit. Atque accusamus sunt earum maxime. Dolore assumenda asperiores ab laboriosam
nesciunt et magnam aperiam itaque amet, est tempora in, expedita quibusdam harum laudantium? Eos aperiam iure
ipsa alias expedita recusandae aliquid neque obcaecati quasi eum. Incidunt quo nemo deleniti, porro pariatur
autem accusantium eaque ratione quod eius. Fugiat omnis fuga nihil provident inventore eaque ex aliquid vero!
Unde sit alias dolorem quo ullam est, maxime magni recusandae. Impedit amet vero incidunt earum velit maiores
neque delectus modi, libero nisi placeat officiis voluptates ullam! Eaque culpa distinctio quae adipisci quo
accusantium sed architecto at, laudantium dolorem! Soluta exercitationem cumque incidunt unde quas?
</p>
<h1 id='5'>5번</h1>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Reprehenderit libero est itaque modi in et laudantium
ratione eligendi, architecto autem veniam necessitatibus id, dolores odio maiores commodi distinctio voluptate,
molestiae reiciendis. Praesentium ratione sed error voluptas eligendi neque dicta possimus molestiae atque. Ad
quae harum sed, officiis assumenda, consequatur voluptatum corrupti facere aliquid repellendus nemo reiciendis,
consectetur enim alias dolor esse illo? Ullam quaerat corporis animi incidunt eligendi rem ipsa dolor voluptates
recusandae repudiandae inventore magnam nostrum vero consectetur amet a commodi architecto, est illum magni
beatae dicta ipsam aliquam cum. Illo esse minus ad dignissimos error iure labore minima aliquid magnam ut a
optio in reiciendis vero magnam veritatis! Explicabo eos ipsum velit aspernatur fuga maiores! Alias quasi,
quibusdam architecto tenetur, iste temporibus ipsa beatae autem quae laboriosam a eaque, asperiores laudantium
maxime assumenda. Delectus sunt fugit voluptatibus magnam eligendi, aperiam porro id assumenda dolor harum
architecto similique nihil autem ratione unde maiores perferendis eos libero aliquid commodi. Dolores eum
maiores dignissimos. Magnam aspernatur aliquid, rem reprehenderit eaque quod nobis placeat mollitia consequatur
fugit, ducimus neque modi delectus nesciunt deserunt minima tempora officia! Molestias ad, rem ut nulla repellat
quas ea eum nemo excepturi cumque expedita incidunt architecto eaque ducimus voluptas corporis aut beatae quia
sint voluptates delectus. Numquam tenetur nesciunt iure hic accusamus vero iusto harum nobis deserunt? Sunt
maxime corrupti iure, voluptate sed quos, exercitationem quis laboriosam cumque numquam eum aliquam earum
doloribus quae reprehenderit. Atque accusamus sunt earum maxime. Dolore assumenda asperiores ab laboriosam
nesciunt et magnam aperiam itaque amet, est tempora in, expedita quibusdam harum laudantium? Eos aperiam iure
ipsa alias expedita recusandae aliquid neque obcaecati quasi eum. Incidunt quo nemo deleniti, porro pariatur
autem accusantium eaque ratione quod eius. Fugiat omnis fuga nihil provident inventore eaque ex aliquid vero!
Unde sit alias dolorem quo ullam est, maxime magni recusandae. Impedit amet vero incidunt earum velit maiores
neque delectus modi, libero nisi placeat officiis voluptates ullam! Eaque culpa distinctio quae adipisci quo
accusantium sed architecto at, laudantium dolorem! Soluta exercitationem cumque incidunt unde quas?
</p>
</body>

</html>

댓글

댓글 쓰기