Enroll Course

100% Online Study
Web & Video Lectures
Earn Diploma Certificate
Access to Job Openings
Access to CV Builder

HTML - Attributes

HTML - Attributes Tutorial. 

HTML - Attributes

Over the course, we have observed or see a few HTML tags and what they are used for, the likes of the heading tags <h1>, <h2>, the paragraph tag <p> and other various tags. We have made use of them currently in their most basic form, but a huge number of these HTML tags can also posses attributes, which are the extra spice of information attached inside the tag.

An Attribute is used for defining the qualities that an HTML element possesses and it is kept inside the HTML element's start tag. All of these attributes are significantly made up of just two parts, which are a name or key and a value

The "name or key" is the quality or property that you want to set for the HTML element. For instance, the HTML element paragraph <p> in the example below holds an attribute that is named align, in which you can use to tell the browser your preferred alignment of the particular paragraph on the page.

The "value" is the particular thing you want the value of the attribute you prefer to be and make sure to always put the value within quotes. The example below describes three possible values of the align attribute: left, right and center.

Attribute names and the attribute values are case-insensitive, meaning that the values and names do not need to follow a particular case style. Although, the W3C which stands for the World Wide Web Consortium usually recommends in their HTML4 recommendation guide. that attributes and attribute values should be in lowercase.


<!DOCTYPE html> 
      <title>Align Attribute  Example</title> 
      <p align = "left">This is left aligned</p> 
      <p align = "center">This is center aligned</p> 
      <p align = "right">This is right aligned</p> 

This will display the following result: 

HTML - Attribute


Main Attributes

The four main attributes that often made use of on the majority of HTML elements are:

1. Id

2. Title

3. Class

4. Style

Generic Attributes

This is a table that contains some of the other attributes that can readily be used with a lot of HTML tags.

Attribute Options Function
align right, left, center Horizontally aligns tags
valign top, middle, bottom Vertically aligns tags within an HTML element.
bgcolor numeric, hexadecimal, RGB values Places a background color behind an element
background URL Places a background image behind an element
id User-Defined Names an element for use with Cascading Style Sheets.
class User-Defined Classifies an element for use with Cascading Style Sheets.
width Numeric Value Specifies the width of tables, images, or table cells.
height Numeric Value Specifies the height of tables, images, or table cells.
title User-Defined "Pop-up" title of the elements.


IT Professional Training and Technical Certification Online