Almost every HTML element can be used with id attributes. The value of the id attribute can be desired. In simple words, the value of id is the name of the element. This name is selected by CSS and is styled under the name. Such as

<!DOCTYPE html>
<html>
<head>
<style>
#demo_head{
color:#f00;
text-transform : uppercase;
}
#demo_para{
text-align:center;
color:maroon;
}
</style>
</head>
<body>

<h1 id="demo_head">ashik.pw demo heading</h1>

<p id="demo_para">demo content goes here.</p>

</body>
</html>

 

Text-transform property can have up to 5 values.

If you put uppercase, all the text inside the element will be displayed in the upper case. Like I did.

If there is none, then the HTML will look like this. It is the default.

If the parent element has a text-transform, the tire will be applied if the parent does not have the properties, if the inheritance is not given, then the default will be available to mean none.

If you enter lowercase, all text will be written in small hands.

Capitalize if the first letter will appear in upper case (for all words)

** Select the id to use the hash (#) symbol. As i did See that the only element that has been written by CSS in the Element ID is affected. In this way, you can use whatever ID you want in the whole HTML document and hold each ID and you can do different styles for those elements.

** To keep the id unique, do not mean that you will not always have the same two elements ID. If you give 1000 Element ID, each name must be different. Any name can be kept, but keep the ID name relevant as well, as I mentioned above.

When to use id

=======================

Suppose your site has 10 HTML elements inside the body element and want to separate each one’s style, it will not match anyone. Then you have to give ID in each element. And when more than one element is required in the style of the class.