HTML - Attributes
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.
Example:
<!DOCTYPE html> <html> <head> <title>Align Attribute Example</title> </head> <body> <p align = "left">This is left aligned</p> <p align = "center">This is center aligned</p> <p align = "right">This is right aligned</p> </body> </html>
This will display the following result:
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. |
Jobs Vacancy
The Jobs portal provides you with real time Jobs Opening and Vacancy Updates curated globally. Start applying for your dream job with ease in any location you choose.
Learn More >>
CV Builder
The CV Builder provides you with comprehensive guide and proven steps to take in writing a professional CV including top CV templates to get you started quickly.
Learn More >>
