HTML Tutorial
HTML Elements
HTML Attributes
HTML Image
HTML Style
HTML Tables
HTML Layout
HTML Forms

HTML Link Bookmarks


Links to web pages can be bookmarked. By clicking on the bookmark link, you can navigate to a specific section of the web page. Usually, link bookmarks are used on long web pages.

HTML Link Bookmarks

Example

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
   <a href="#home">Home</a>
   <a href="#about">About</a>
   <a href="#contact">Contact</a>
   <br>
   <br>
   <br>
   <div  id="home">
    <h3>Home Section</h3>
       <p>
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Ullam, eligendi consequuntur quaerat harum quis labore doloribus repellat necessitatibus laboriosam dolore id hic tenetur minus veritatis fuga totam sequi tempore nobis minima facere rem vitae quibusdam aliquid distinctio? Officiis, sed assumenda.
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Similique atque quis minima facilis veritatis vitae quibusdam qui aperiam nulla iste eius, ad quidem voluptates aliquam at accusamus sapiente nihil ullam vel aut magnam illum? Quasi, corporis eos. A reprehenderit tenetur nihil ex mollitia eius, excepturi cum. Labore aspernatur repellendus veritatis vitae nihil dignissimos consequuntur, hic ea provident, adipisci exercitationem? Earum enim illo repellendus! Eius, dolores in nesciunt tempora praesentium, quae alias commodi rem saepe ea quo impedit vero, reprehenderit optio!
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Praesentium corporis tempora architecto suscipit aliquam amet dolorum ut excepturi illum ad vel eveniet sunt tenetur, officia dolore quod commodi doloribus, ipsum id atque quis nostrum, ab molestias. Inventore qui labore necessitatibus quis, obcaecati odit mollitia dolorum ullam, quo, animi vel dolor.
       </p>
       <br>
       <br>
   </div>
   <div id="about">
    <h3>About Section</h3>
       <p>
        Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quod excepturi adipisci, dolorum expedita sit quasi fugit! Aut veniam deserunt incidunt quaerat nisi, voluptatem dolores. Molestiae repellendus non perferendis repudiandae adipisci voluptatibus laborum. Animi dicta ipsum reiciendis. Doloribus numquam placeat ipsa eligendi nulla blanditiis expedita, sint tempora incidunt, recusandae eius distinctio, saepe in est animi id inventore vel eaque voluptatum aspernatur dignissimos. Maiores dolore quam similique odio necessitatibus sint totam quidem unde praesentium dolor molestiae minus est animi quis consectetur molestias nemo recusandae illum ducimus tempore consequatur, culpa hic. Enim nemo assumenda veritatis veniam beatae error reprehenderit sapiente modi, facere doloribus. Error, dolorem modi? Enim possimus, harum quo nulla ipsam consequatur optio sit perferendis exercitationem quasi. Quam quasi cumque error excepturi, magni pariatur dicta. Dolorum, tenetur nihil quis aliquid sapiente voluptatibus ut odit rem ipsa, quisquam deleniti quos impedit explicabo perspiciatis quam vel adipisci consectetur corrupti enim ipsum! Reiciendis minus, temporibus aliquam labore quibusdam facilis tempora qui possimus adipisci? Rerum, cupiditate excepturi atque doloribus placeat similique quod laboriosam obcaecati omnis. Aspernatur ullam porro aperiam voluptatum autem ipsa, eligendi corporis dicta neque dolor molestias suscipit numquam consequatur, fugit ex, illum itaque explicabo expedita recusandae veritatis perspiciatis commodi voluptatem. Eveniet expedita cumque iste.
       </p>
       <br>
       <br>
   </div>
   <div id="contact">
    <h3>Contact Section</h3>
       <p>
        Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quod excepturi adipisci, dolorum expedita sit quasi fugit! Aut veniam deserunt incidunt quaerat nisi, voluptatem dolores. Molestiae repellendus non perferendis repudiandae adipisci voluptatibus laborum. Animi dicta ipsum reiciendis. Doloribus numquam placeat ipsa eligendi nulla blanditiis expedita, sint tempora incidunt, recusandae eius distinctio, saepe in est animi id inventore vel eaque voluptatum aspernatur dignissimos. Maiores dolore quam similique odio necessitatibus sint totam quidem unde praesentium dolor molestiae minus est animi quis consectetur molestias nemo recusandae illum ducimus tempore consequatur, culpa hic. Enim nemo assumenda veritatis veniam beatae error reprehenderit sapiente modi, facere doloribus. Error, dolorem modi? Enim possimus, harum quo nulla ipsam consequatur optio sit perferendis exercitationem quasi. Quam quasi cumque error excepturi, magni pariatur dicta. Dolorum, tenetur nihil quis aliquid sapiente voluptatibus ut odit rem ipsa, quisquam deleniti quos impedit explicabo perspiciatis quam vel adipisci consectetur corrupti enim ipsum! Reiciendis minus, temporibus aliquam labore quibusdam facilis tempora qui possimus adipisci? Rerum, cupiditate excepturi atque doloribus placeat similique quod laboriosam obcaecati omnis. Aspernatur ullam porro aperiam voluptatum autem ipsa, eligendi corporis dicta neque dolor molestias suscipit numquam consequatur, fugit ex, illum itaque explicabo expedita recusandae veritatis perspiciatis commodi voluptatem. Eveniet expedita cumque iste.
       </p>
       <br>
       <br>
   </div>

   <br>
   <br>       
   <br>      
   <br>
   <br>
   <br>
   <br>
   <br>
   <br>
   <br>
   <br>
   <br>
</body>
</html>
Try it Yourself