What is Id Attribute?
In HTML, the 'class attribute' is used to uniquely identify an HTML element within a document. CSS and JavaScript can target an HTML elements with the unique id value to apply CSS styles or define behaviors. In other words, it allows you to multiple HTML elements with the id value using CSS and JavaScript.
To add an id attribute in an HTML element, you need to add id="id-value" in the openning tag of an HTML element.
Example of Adding Id Attribute to an HTML Element
In the following example, we have a paragraph (<p>) element with an id value "test" at the openning tag as id="test". Here id is the HTML id attribute and "test" is the id value. "test" can be used to target and apply CSS style to the paragraph element.
Here id="test" is the HTML id attribute.
Example of HTML Class Name
Example of Adding Id in Internal CSS Style Element
In the following example, we have added HTML <style> tag between the <head> and </head> tag; it is known as internal CSS style. Inside the style element, we have added CSS id test. To define an id in CSS style hash (#) sign must be put before the id name as shown in the following example. color and font-size CSS properties have been set in the id. Color has been set to red and font-size has been set to 18px.
Here #test" is the CSS ID selector.
Thus, you have targetted HTML paragrapgh element using its id attribute (id="test") and CSS ID selector (#test).
Review the example closely.
Example of Adding Class in CSS Style Element
Output of the above example
You can use HTML id attribute value as selector to add style to the element within head element to apply CSS style.
