0Pricing
HTML Academy · Lesson

Linking to Sections Fragment Identifiers

Jump to page sections using id attributes and hash links.

What Is a Fragment Identifier?

A fragment identifier is the part of a URL after the # symbol:

https://example.com/page#section-3
                          │
                          └─ Fragment: "section-3"

<!-- The browser: -->
<!-- 1. Loads the page -->
<!-- 2. Scrolls to the element with id="section-3" -->

Creating Anchor Targets with id

To link to a section, give it an id:

<!-- The target: give any element an id -->
<h2 id="installation">Installation</h2>
<h2 id="configuration">Configuration</h2>
<h2 id="faq">Frequently Asked Questions</h2>

<!-- The link: use # + id value -->
<a href="#installation">Jump to Installation</a>
<a href="#faq">Go to FAQ</a>

All lessons in this course

  1. The anchor Element and href Attribute
  2. Absolute vs Relative URLs
  3. Opening Links in New Tabs and Download Attribute
  4. Linking to Sections Fragment Identifiers
← Back to HTML Academy