HTML Bookmark Links

« Prev Next »

Bookmark links enable users to navigate directly to a particular section of a webpage. This is useful for:

 

  • Navigating long pages (like FAQs, blogs)
  • Creating a table of contents
  • Linking to specific sections from other pages

How Bookmark Links Work

Basic Structure

Any webpage element can be transformed into a target by adding an id attribute to it.

<h2 id="about">About Us</h2>
Run ›

Create a link to that ID:

<a href="#about">Go to About Section</a>
Run ›

Example

 <h1>Welcome to My Website</h1>

<a href="#services">Our Services</a> |
<a href="#contact">Contact</a>

<h2 id="services">Services</h2>
<p>We offer web design, SEO, and development.</p>

<h2 id="contact">Contact</h2>
<p>Email us at info@example.com</p>
Run ›
notepad
  • Always use unique IDs (e.g., id="faq", not id="section1" everywhere)
  • IDs are case-sensitive (#Team ≠ #team)
  • You can use any element with an id (like <div>, <section>, <h2>, etc.)
« Prev Next »

Quickly Find What You Are Looking For

OnlineTpoint is a website that is meant to offer basic knowledge, practice and learning materials. Though all the examples have been tested and verified, we cannot ensure the correctness or completeness of all the information on our website. All contents published on this website are subject to copyright and are owned by OnlineTpoint. By using this website, you agree that you have read and understood our Terms of Use, Cookie Policy and Privacy Policy.