Attributes
HTML attributes provide extra information about elements, or In HTML, attributes are used to define the properties or behavior of an element. They add more details and control how elements behave or appear. As they can define a link's destination, set an image's size or apply inline styles.
An attributes always
An attributes always
- Appears inside the opening tag.
- Uses the format name="value".
Example:
Commonly Used HTML Attributes
href Attribute
The href attributes is used in anchor tag (<a>) to define the destination of a hyperlink.
Example:
Output:

A clickable link with name Google will appear on the page that redirects to google after clicking on it.
src Attribute
The src attribute is used in the <img> tag to define the image source.
Example:
Output: Image of logo will display from the given URL.
width and height Attribute
The width and height attribute are used to adjust the size of the image under the <img > tag.
Example:
Output:

Alt Attribute
The alt attribute defines alternative text for an image displayed, if the image fails to load.
Example:
Output:

Style Attribute
The style attribute adds inline CSS style to the element, such as color or background-color etc.
Example:
Output:

lang Attribute
The lang attribute is used to declare the language of the web pages. It is declared inside the <html> tag.
Example:
title Attribute
The title attribute is used to declare extra information as a tooltip when you hover over an element.
Example:
Output:

When you hover over the paragraph you will see a tooltip saying 'paragraph'.
<img src="image.jpg" alt="Random Image">
- Src this tells the browser where the image is located.
- alt gives alternative text if the image does not load.
href Attribute
The href attributes is used in anchor tag (<a>) to define the destination of a hyperlink.
Example:
<a href="https://www.google.com"> Google </a>
Output:

A clickable link with name Google will appear on the page that redirects to google after clicking on it.
src Attribute
The src attribute is used in the <img> tag to define the image source.
Example:
<img src="https://quipoin.com/assests/img/logo.png">
Output: Image of logo will display from the given URL.
width and height Attribute
The width and height attribute are used to adjust the size of the image under the <img > tag.
Example:
<img src="https://quipoin.com/assets/img/logo/png" height="100px" width="100px">
Output:

Alt Attribute
The alt attribute defines alternative text for an image displayed, if the image fails to load.
Example:
<img src="https://quipoin.com/assets/img/logo.png" alt="Logo" height="100px" width="100px">
Output:

Style Attribute
The style attribute adds inline CSS style to the element, such as color or background-color etc.
Example:
<p Style="Color:blue;">This is a paragraph in blue color</p>
Output:

lang Attribute
The lang attribute is used to declare the language of the web pages. It is declared inside the <html> tag.
Example:
<!DOCTYPE html> <html lang="en"> <body> </body> </html>
title Attribute
The title attribute is used to declare extra information as a tooltip when you hover over an element.
Example:
<p title="paragraph">This is a paragraph</p>
Output:

When you hover over the paragraph you will see a tooltip saying 'paragraph'.
NOTE
- Attributes are not case-sensitive, but it is a good practice to write them in lowercase.
- Always enclose attributes values in quotes, preferably double quotes (name="value").