HTML Basics: Attributes in HTML

HTML attributes are the additional information provided in a HTML element. They are always specified in the starting or opening tag. Attributes are specified using name value pairs i.e., <opening tag attribute_name=”value”>. In this tutorial, we are going to see some commonly used attributes in HTML.

Attributes in HTML

Perhaps, the most common type of HTML attribute that you would be encountering most frequently is the “href” attribute. The “href” attribute is used to create hyperlinks in the web page. A hyperlink is the most common way of navigation or a medium of browsing in a web site. Usually it is represented in dark blue colour. Another characteristic of hyperlink is the change of mouse cursor to a hand shaped tool when the cursor is pointed over it. The “href” attribute is used with the <a> tag.

 

 

For example, to create a hyperlink that says “to the next page” with the URL address of http://abc.com/a.htm would be written as:

<a href=” http://abc.com/a.htm”> to the next page </a>

One important thing to remember is the use of double quotes to define the attribute value. This is not a rule but it’s a good idea to stick to the convention. This doesn’t mean that you cannot use the single quotes. For the particular case when there is a double quote in the value of the attribute it is inevitable to use the single quotes to define the value. For example:

<form name=’ABX”XYZ’>

Just like all the tags and elements in the HTML, attributes are case insensitive. That means you can use both upper case or lower case or the combinations of these two to write the attributes. But it’s a good idea to use lower case attributes, a recommendation by the w3 consortium.

Standard attributes in HTML

There are a large numbers of attributes that can be used in the HTML. But for simplicity, we would be discussing the most common or standard ones. The standard attributes of the HTML can be grouped together under the following headings.

Core Attributes:

1. Class: it is used to specify a class name for an object or an element. Using the class attribute, several elements can be grouped together under a common class name.
2. Id: it is used to associate a unique id with an element or object.
3. Style: it is used to define the inline CSS style elements.
4. Title: this is the text that provides more information about a particular element in the web page.

Language Attributes:

1. Dir: the value to this attribute is provided as the left to right or right to left. It is used to specify the direction of the content in an element or an object.
2. Xml:lang : this attribute is particularly used in the XHTML when using XML. It is used to define the language code for the content of an element or an object.
3. Lang: this is more generic than the previous attribute. The value to be provided is written as the language code.

Keyboard Attributes:

1. Tabindex: a number is provided as the value for this attribute. It is used to specify the tab order of the element.
2. Accesskey: it is used to define a keyboard shortcut to an element in the web page. A character value is provided with this attribute.