Using The id Attribute | id Attribute | HTML - Online Editor

Using The id Attribute

The id attribute specifies a unique id for an HTML element. The value of the id attribute must be unique within the HTML document.

The id attribute is used to point to a specific style declaration in a style sheet. It is also used by JavaScript to access and manipulate the element with the specific id.

The syntax for id is: write a hash character (#), followed by an id name. Then, define the CSS properties within curly braces {}.

In the following example we have an <h1> element that points to the id name "myHeader". This <h1> element will be styled according to the #myHeader style definition in the head section:

<!DOCTYPE html>
<html>
<head>
<title>id Attribute</title>
<style>
#myHeader {background-color: lightblue;color: black;padding: 40px;text-align: center;} 
</style>
</head>
<body>

<h2>The id Attribute</h2>
<p>Use CSS to style an element with the id "myHeader":</p>

<h1 id="myHeader">GSSS KHOKHAR</h1>

</body>
</html>

Live Demo & Try it yourself!

Note: The id name is case sensitive!

Note: The id name must contain at least one character, cannot start with a number, and must not contain whitespaces (spaces, tabs, etc.).

CSPunjab.Com

Filter (Advanced Search)

Downloads 0 Share 0 Views 4.1K

Video

Video is not available... Embedded is previous playlist.

HTML Watch on YouTube

Details

The id attribute specifies a unique id for an HTML element. The value of the id attribute must be unique within the HTML document.

The id attribute is used to point to a specific style declaration in a style sheet. It is also used by JavaScript to access and manipulate the element with the specific id.

The syntax for id is: write a hash character (#), followed by an id name. Then, define the CSS properties within curly braces {}.

In the following example we have an <h1> element that points to the id name "myHeader". This <h1> element will be styled according to the #myHeader style definition in the head section:

<!DOCTYPE html>
<html>
<head>
<title>id Attribute</title>
<style>
#myHeader {background-color: lightblue;color: black;padding: 40px;text-align: center;}
</style>
</head>
<body>

<h2>The id Attribute</h2>
<p>Use CSS to style an element with the id "myHeader":</p>

<h1 id="myHeader">GSSS KHOKHAR</h1>

</body>
</html>

Note: The id name is case sensitive!

Note: The id name must contain at least one character, cannot start with a number, and must not contain whitespaces (spaces, tabs, etc.).