Attributes are special words generally used inside the opening tag to control the behaviour of the ELEMENTS. It provides additional information about an element. These are used as modifiers of a anTML element type.

Attributes comes in name/value pairs in the format name=“value”. Both attributes name and values are case insensitive, but W3C recommends lower case for both.

There are some pre-defined attributes which are associated with specific TAGS only like src, alt, and href. We will look into them first.

HTML links are created using <a> tag. It have a special href ATTRIBUTE, which specifies the address to open when the link is clicked.

HTML images are created using <img> tag. The file to be open is specified using src attribute.

HTML images can have 3 other attributes also. They are width, height and alt. The attribute width and height specifies the width and height of the image, and is generally used to make a larger image SMALL. The alt attribute mainly does two things. One, if for some reason the web-page is not able to open the image it will show the test inside alt attribute. Secondly, it is read by screen-reader used by vision imparted person.

<img src=“../images/sunset.jpg” width=“300” height=“300” alt=“A beautiful sunset”>

The next three attributes - class, id and style are used extensively in html tags and are generally used with any tag.

The class attribute is generally used when we need to apply the same style to more than one html tags. We use the same class name in them and then style it in css.

The id attribute is used when we need to identify an element/tag as unique. We can have only one id name attribute used through our HTML, but can have one class name used at many places.

The style attribute is used to inline CSS styles within the element/tag. Example of all three attributes are in below code.

Save the above code as demo.html and open in any browser.