Demon Tech Roadmap

HTML

HTML Id Attribute

The HTML id attribute uniquely identifies an element on a page.

Read Time

5 min read

Difficulty

Beginner

Last Updated

Jun 15, 2026

Version

v1.0.0

Introduction

HTML uses the `id` attribute to give an element a unique identifier. No two elements on the same page can share the same id. Developers use the id to target an element with CSS or JavaScript.

Syntax

1<!-- id syntax -->
2<h1 id="main-title">Heading</h1>

Example

1<!-- this applies an id -->
2<!DOCTYPE html>
3<html lang="en">
4  <head>
5    <meta charset="UTF-8">
6    <meta name="viewport" content="width=device-width, initial-scale=1.0">
7    <title>Id Attribute</title>
8  </head>
9  <body>
10    <p id="unique-paragraph">This is unique.</p>
11  </body>
12</html>

Try it Yourself

Hands-on Practice

Modify the code below to see how it affects the output. This is the best way to learn!

Interactive Editor

1234567891011121314151617181920

Live Preview

Key Points

The `id` attribute is unique per page.
Elements only accept one id.
CSS selects IDs with a hash symbol.
JavaScript finds elements using their id.

Up Next

Continue your journey with the next topic.

Go to HTML Buttons ❯