Global Attribute – Class, ID and Style
Global attributes are the attributes that you can set for any HTML tag. The class
, id
, and style
attributes are the three major global attributes. Those are very important to bridge between HTML and CSS. As we explain CSS in detail in the next chapter, we'll give you the key points of these attributes mainly from the HTML point of view.
Class attribute
The class
attribute is used to categorize HTML tags mainly for styling purposes. For styling purposes, the tags with the same class are handled by CSS as one group. For example, you can change the font color to red only for the text between the tags with the red class. The syntax of CSS will be explained in the next chapter.
ID attribute
We have already explained the id
attribute to specify the location of a specific element in an HTML document. It is also used to specify the tag to add special styling by CSS.
Style attribute
The role of the style attribute is different from the other two attributes explained above. This attribute is used when you want to directly type CSS code in a specific tag. Using this attribute, you can add styles specifically to the element.
<style> tag vs. style attribute
If you are a beginner, you may be confused about the <style>
tag and the style
attribute.
The <style>
tag is used when you want to apply styles to the HTML document while the style
attribute is used to apply styles to a specific element that has the style
attribute.