Home » HTML » HTML Attributes

HTML Attributes

HTML attribute defines the characterstics of any HTML element. These attributes provide additional information to the browser about the element like, its size, color, behaviour, etc.

Some important points regarding HTML Attributes:

Attributes provide additional information about an element.
Attributes are always specified in the start tag.
Attributes usually come in name/value pairs like: name="value".
Ex.- 'src' in <img> tag OR 'href' in <a> tag,etc..

HTML Lang Attribute

The 'lang' attribute is declared in the opening <HTML> tag. It gives information to the browser about the main language used in the html document. Although it is not necessary to use but using it is a good practice.

You can check all the values of lang attribute for different languages from here.

Example Try this code »

<!DOCTYPE html>
<HTML lang="en">
<head>
<meta charset="UTF-8">
<title> HTML Lang Attribute </title>
</head>
<body>
<p> This page is using English Language. </p>
</body>
</html>

Output

HTML Lang Attribute

This page is using English Language.

HTML Title Attribute

The Title attribute is used to specify a tooltip. That tooltip could be some important piece of information in text form. It is often displayed when cursor comes over the element or while the element is loading.

Adding tooltips using Title attribute, is a smart way to give brief explanations about some element on the webpage. Look at the example below, to see how you can use it with any HTML tag.

Example Try this code »

<!DOCTYPE html>
<HTML lang="en">
<head>
<meta charset="UTF-8">
<title> The Title Attribute </title>
</head>
<body>
<h3 title= "Hello HTML"> The Example of Title Attribute </h3>
</body>
</html>

Output

HTML Title Attribute Example

WHO was founded in 1948.

CodeRepublics.com

HTML Src Attribute

The src or (source) attribute is used with <img> tag. This attribute allows us to provide the path for the image to be included on the webpage. it is also used with <audio> tag, <video> tag, <embed> tag, etc. to add the source path of the file to be included.

Example Try this code »

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> HTML Image Alt Attribute </title>
<body>
<img src="HTML-Image.png" alt="HTML5 Image" style="width:400px; height:250px;">
</body>
</html>

HTML alt Attribute

The alt attribute specifies an alternative text for an image. If somehow the browser is not able to display an image, then the alternate text will be displayed, which will give the information about the image. Also, value of alt attribute can be read by screen readers, which helps visually impaired person to "hear" information about the image.

If a browser cannot find an image, it will display the value of the alt attribute :

Example Try this code »

Output

HTML Image Alt Attribute Example HTML5 Image

HTML style Attribute

The style attribute is used to specify the inline style of an element, i.e., it defines the CSS styling of element like color, font, size, shadow etc.

Example Try this code »

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> Inline Styles </title>
</head>
<body>
<h4 style="color:green"> This is Green Color </h4>
<h4 style="color:blue"> This is Blue Color </h4>
</body>
</html>

Output

Inline Style

This is Green Color

This is Blue Color

Recommended :

1 . Html Form Attributes
2 . How HTML Tags are different from Attributes
3 . How to Use Meter Tags
4 . How does html5 canvas work?

5 . How to add Video in HTML ?
6 . Simple Navigation bar in HTML
7 . Create Bootstrap 4 Spinner
8 . Create Simple Login Form

Web Developement Courses
BootStrap Snippets
JS Keywords
Form Events
CSS Navbar
JS Objects
Cookies
Forms
Icons
Buttons
Progress
Footer
Errors