The id attribute uniquely identifies an HTML element within a page. Each ID must be unique, making it useful for linking, styling, and scripting specific elements.
HTML ID Attribute Syntax
Explanation of Syntax:
tagname: The name of the HTML element (e.g.,<div>,<h2>).id="unique_id": Theidattribute provides a unique identifier for the element.
HTML
x
<tagname id="unique_id">Content</tagname>HTML ID Attribute Example Code
Explanation of Code:
- The code starts with the
<!DOCTYPE html>declaration and the opening<html>tag. - The
<head>section includes metadata and a CSS style for the#main-contentID, which gives it a light blue background and padding. - The
<body>section contains:- An
<h1>tag with a welcome message. - A
<div>tag assigned the unique ID “main-content,” allowing for specific styling and identification. Inside the<div>, a<p>tag describes the content area.
- An
- The
idattribute is beneficial for referencing specific elements in CSS and JavaScript, ensuring that each element can be individually styled or manipulated without affecting others.
HTML
<html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>ID Attribute Example</title> <style> #main-content { background-color: lightblue; padding: 20px; } </style></head><body> <h1>Welcome to My Website</h1> <div id="main-content"> <p>This is the main content area with a unique ID.</p> </div></body></html>
HTML Labs
