tutorialstonight logo
A Platform To Learn To Code

HTML ATTRIBUTE



Generally, we use HTML elements in the simplest form but using HTML attributes we can control element's looks, size of content, the position of the content and can add other useful information with the element.

HTML attribute is special words which gives additional information to the HTML element. Attributes have two components name and value.

HTML attribute is only specified in starting tag only. You can add more than one attribute to an element by giving space between them.

The attribute has two properties:

  1. name: - name is the first part of the attribute which specifies the name of the attribute.
  2. value: - value is the second part of the attribute and it contains the value of the attribute.

Syntax:

<tag name="value">Content of the element</tag>

Example

Run the code

HTML Core Attributes

There are few attributes which can be used with most of the HTML element. These attributes are:

  1. style
  2. class
  3. id
  4. title


1). style Attribute

The style attribute allows us to use inline CSS in our element. We can style the element by setting CSS rules in the style attribute.

Using style attribute we can add almost all CSS property to the element.

Example

Run the code

2). class attribute

The class attribute can be used in almost all HTML elements.

When a class is defined in any HTML element then that element contains all the property mentioned for that class.

Example

Run the code

3).id attribute

The id attribute is used to uniquely identify any HTML element. An HTML document can't have more than 1 same id, each and every id should be unique.

It is used by CSS and javascript to perform certain tasks of a specific element.

Example

Run the code
Both class and id look the same when used for css but you can use a specific class as many times you want in you web page but id can be used only once.


4). title attribute

The title tag is used to provide additional information to the content of the element.

It shows the information provided when you take the mouse pointer over it.

Example

Run the code

Other useful attributes

  • href Attribute

    In <a> tag href attribute is used to specify the address of the link.

    Example

    Run the code
  • src Attribute

    src attribute is used to define file location in <img> tag.

    Example

    Run the code
points to remember Points to remember:
  1. HTML attribute give additional information to the element.
  2. HTML attributes are only defined in starting tag.
  3. An element can have more than one attribute.
  4. All HTML element has 4 core attribute: title, style, id and class.
HTML Element