HTML Links
In this tutorial, we will learn about hyperlink , use image and email as link in HTML with the help of examples.
Links
A Link is a connection from one page to another page. A web page can contain various links that take you from one page to another.
These links also allow users to jump one section to another section on the same webpage.
Hyperlink
HTML links are also known as Hyperlinks.These links don’t have to be text.
A link can be an image or any other HTML element.
The <a> element defines a hyperlink.
The href attribute is the most important attribute of <a> element.
By default, hyperlinks will display as follows in all browsers:
- Unvisited link – it is underlined and blue.
- Visited link – It is underlined and purple.
- Active link – It is underlined and red.
Attributes of <a> Element
| Attribute | Value | Description |
|---|---|---|
| href | URL | It specify the link's destination |
| target | _blank, _self, _parent, _top | It specify where to open the link in the new tab/window or the same |
Note : A hash # within a hyperlink specifies an html element id to which window should be scrolled.
Example :
<!DOCTYPE html>
<html>
<head>
<title>Hyperlink</title>
</head>
<body>
<a href = "www.algbly.com" target = "_blank">An HTML Link</a>
</body>
</html>Output
An HTML Link
Use Image as a link
We can use an image as a link by putting <img> tag inside <a> element.
Example :
<!DOCTYPE html>
<html>
<head>
<title>Image Hyperlink</title>
</head>
<body>
<a href = "www.algbly.com" target = "_blank">
<img src = "html.jpg" width = "60px">
</a>
</body>
</html>Output
Link to send Email
We can use an email as a link by putting the value mailto: email_address inside href attribute to create a link.
Example :
<!DOCTYPE html>
<html>
<head>
<title>Email Hyperlink</title>
</head>
<body>
<a href = "mailto : algblycode@gmail.com">Send mail</a>
</body>
</html>Output
Send mail
Next Tutorial
We hope that this tutorial helped you develop better understanding of the concept of Links in HTML.
Keep Learning : )
In the next tutorial, you'll learn about HTML Block & Inline Tag.