The attributes are used to personalize tags. What do i mean ? Somehow , someday you want to resize a image or a table or to change a font color. All these are possible with the help of the attributes.
Most tags have their own attributes. We will talk about this as we include it in our new tag. We will learn about a set of generic attributes which can be used with the majority of the tags.
Attributes are putted between the angular brackets (<>) of the opening tag.
These two attributes are mostly the same. They have no straight role in the formatting of the elements but they are useful behind the scene with the help of CSS. We will talk about their role at the right time when we study their syntax and their function in CSS.
The idea is that when you want to set a class of tags for being used later with the help of CSS, you can make the difference between two identical tags but with different attributes. Take a look at the next example :
html<p id="italicparagraph">Paragraph type 1, italic </p>
<p id="boldparagraph">Paragraph type 2, bold </p>
"name" is a bit different from "id" and "class". If you give a name to an element this one becomes a script variable for JavaScript, ASP, and PHP. Something that is very often meet in formulations and other interactive text fields.
html<input type="text" name="TextField" />
This attribute has no effect on the display of the text box, even if in the background it plays a very important role.
This attribute is used rarely. He adds a title (a pop-up) to every element's content. This attribute should not be forgotten. You can name almost everything however you want. The visualization appears when you need to stop with your mouse for a few seconds above the content.
html<h2 title="I am a title attribute!!">A random title</h2>
Pass with your mouse over the upper title so that you see the magic of the"title" attribute. This attribute will give yo your site a bit of interaction with those who visit you. Do not pass over this detail.
If you want to align in a different way some elements of your page then you have at your disposition the "align" attribute. You can align to the left, right, or the center of the page with almost every element. By default, elements will align to the left, excepting when it is specified another alignment.
html<h2 align="center">Centered title </h2>
html<h2 align="left">Title aligned to the left </h2>
<h2 align="center">Centered title </h2>
<h2 align="right">Title aligned to the right </h2>
Most of the tags are attributed to standard attributes. This means that if you do not specify another attribute, the browser will do it for you. For example, a paragraph will align by itself to the left, excepting when you specify in another way; the same is with a table. As long as you practice you will understand many more things about the default values of some tags.
You must keep in your mind that attributes are used to design the elements of a web page. I have put here together some of the most commune attributes used in HTML :
Attribute | Options | Function |
align | right, left, center | Horizontal alignment |
valign | top, middle, bottom | Vertical alignment |
bgcolor | numerical, hexadecimal, or RGB value | A background behind an element. |
background | URL | An image behind an element. |
id | Defined by user | Names an element which will be used with CSS. |
class | Defined by user | Classifies un element which will be used with CSS |
width | Numerical value | Specifies the width of a table, image or table box. |
height | Numerical value | Specifies the height of an table, |
title | Defined by user | "pop-up" a title for an element |