In HTML attributes are used to add extra information to an HTML element. Attributes are always specified in the opening tag. It is enclosed with a double quote.
There are various attributes in HTML:
To add a link in HTML we used <a> tag. Inside <a> tag href is used to specify the address.
<!DOCTYPE html>
<html>
<body>
<h2>The href Attribute</h2>
<p>HTML links are defined with the a tag. The link address is specified in the href attribute:</p>
<a href="https://www.studentstutorial.com">Visit Students Tutorial</a>
</body>
</html>
HTML images are specified with the <img> tag.
The src attribute is used to specifed the source of the filename.
<!DOCTYPE html>
<html>
<body>
<h2>The src Attribute</h2>
<p>The src attribute is used to specifed the source of the filename.</p>
<img src="sun-rise.jpg">
</body>
</html>
To specifies the width and height of the image width and height attribute is used.
<!DOCTYPE html>
<html>
<body>
<h2>The src Attribute</h2>
<p>The src attribute is used to specifed the source of the filename.</p>
<img src="sun-rise.jpg" width="500" height="400">
</body>
</html>
The alt attribute is used to show alternative text if any problem for showing the image. Some time if the image file not found or due to pour page load the image not show. In that case the alt attribute show the value to user.
<!DOCTYPE html>
<html>
<body>
<h2>The src Attribute</h2>
<p>The src attribute is used to specifed the source of the filename.</p>
<img src="sun-rise.jpg" alt=”Display Picture” width="500" height="400">
</body>
</html>
<!DOCTYPE html>
<html>
<body>
<h2>The style Attribute</h2>
<p style="color:red;font-size:20px;">This is a paragraph with color red.</p>
</body>
</html>
To declared language of the page the lang attribute is used. It is placed in <html> tag.
<!DOCTYPE html>
<html lang="en-US">
<body>
Content goes here..
</body>
</html>
The title attribute is used to define a button, image, paragraph in a html page.
<!DOCTYPE html>
<html>
<body>
<h2 title="I'm a header">The title Attribute</h2>
<button title="I'm a Button">
Hover Mouse
</button>
</body>
</html>