Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Difference between linking an image, website, and email address in HTML
In this article, we are going to discuss the difference between linking an image, website, and email address in HTML.
To link or embed an image into a website, the <img> tag is used.
To link a website, we use <a> anchor tag with href (hypertext reference) attribute.
To link an email address, we use mailto inside the href attribute of <a> anchor tag.
Linking an Image
In HTML, we use the <img> tag to embed or link an image to a website. This tag requires "src" attribute for the path of the image that we want to link and "alt" attribute that specifies a text description of the image. This "alt" text will be displayed on the page if the image can't be loaded for some reason.
Syntax
Following is the syntax for HTML <img> tag −
<img src = "path of the image" alt = "text description">
Example
In the following example, we are linking an image to a webpage using the HTML<img> tag −
<!DOCTYPE html>
<html>
<head>
<title>Linking an image</title>
</head>
<body style="background-color: lightgrey; text-align: center;">
<h2 style="color: black;">Tutorialspoint, simply easy learning...</h2>
<!--Linking an image-->
<img src="https://www.tutorialspoint.com/images/logo.png?v2" alt="TP logo">
</body>
</html>
Output
As we can see in the output, the image that we provided is linked on the webpage.
Linking a Website
The HTML <a> anchor tag with href attribute is used to create a hyperlink to any of the web pages, files, emails, particular sections in the same webpage.
Syntax
Following is the syntax of HTML <a> anchor tag to link a website −
<a href = "website address"> Name of the link </a>
Example
In the example below, we are linking a website using the HTML <a> anchor tag with href attribute −
<!DOCTYPE html>
<html>
<head>
<title>Linking an website</title>
</head>
<body style="background-color: lightgrey; text-align: center;">
<h2 style="color: black;">Tutorialspoint, simply easy learning...</h2>
<!--Linking a website-->
<a href="https://www.tutorialspoint.com/index.htm"> Click here for Tutorialspoint</a>
</body>
</html>
Output
After executing the above program, if we click on "Click here for Tutorialspoint", it will redirect to the destination webpage.
Linking a Mail Address
To link an email address in HTML, we use the <a> anchor along with mailto inside the href attribute.
Syntax
Following is the syntax to link a mail address in HTML −
<a href = "mailto: example@mail.com"> name of the mail </a>
Example
In the following example, we are linking an email address using the HTML mailto link in the href attribute of <a> anchor tag.
<!DOCTYPE html>
<html>
<head>
<title>Linking an image</title>
</head>
<body style="background-color: lightgrey; text-align: center;">
<h2 style="color: black;">Tutorialspoint, simply easy learning...</h2>
<!--Linking an email-->
<a href="mailto:support@tutorialspoint.org">Contact for support</a>
</body>
</html>
Output
On executing, if we click on the "Contact for support", it will redirect you the mail application.
171 Views
