HTML Attributes
You can define an attribute as the characteristics of any HTML tag that needs to be placed within the opening tag.
HTML attributes consist of two parts:
- a name and
- a value
Names of attribute and its values are not case-sensitive. But according to the World Wide Web Consortium (W3C), it is recommended to use lowercase name and value. For an attribute, the name defines the property to be implemented. For example, BODY Tag, <body> carries many attributes such as bgcolor, background that you can implement for indicating the back color of your webpage, or give a specific image or background texture to your page, respectively.
The value defines the value which you want to assign to the property and is set within quotations.
Example:
<!DOCTYPE html>
<html>
<body bgcolor="#E6E6FA">
</body>
</html>Table of Contents
Core Attributes
There are four essential attributes which you can implement on almost all HTML elements:
- id
- title
- class
- style
Let’s discuss these special attributes:
id Attribute
This attribute can be implemented for providing unique identification to any element. There are two primary reasons that you might want to use an id attribute on an element. The id attribute provides a unique identifier, which eventually makes it possible to identify the HTML element. When you contain two elements with the same name within the same script, the id attribute helps to distinguish the two same elements via the unique ID.
Example:
<p id = "para1"> Paragraph 1 in your HTML document.</p>
<p id = "para2"> Paragraph 2 in your HTML document.</p>title Attribute
This attribute gives a recommended title for your element. Its behavior depends on the element upon which it’s implemented, even though this is often implemented to display a tooltip if the cursor hovers (comes over) the element.
Example:
<h3 title="Welcome to my Journal">Please visit</h3>
class Attribute
This attribute is implemented by combining an element through a stylesheet (CSS) and identifying its class element. For more about class attribute, you can follow the Cascading Style Sheet (CSS).
Here’s an example of a class attribute:
Example:
<p class = "classname1 classname2">This is a sample paragraph text.</p>style Attribute
This attribute gives you a chance for specifying the rules for Cascading Style Sheet (CSS) in your element.
Example:
<p style = "font-family:arial;">An example of style attribute.</p>