Course Content
HTML Introduction
0/1
HTML Editors
0/1
HTML Basic Tags
0/1
HTML Elements
0/1
HTML Attributes
0/1
HTML Headings
0/1
HTML Paragraph
0/1
HTML Text Formatting
0/1
HTML Meta Tags
0/1
HTML Quotations
0/1
HTML Comments
0/1
HTML Images
0/1
HTML Background
0/1
HTML Colors
0/1
HTML Lists
0/1
HTML Tables
0/1
HTML Forms
0/1
HTML Spell Check
0/1
HTML Media
0/1
HTML Marquees
0/1
HTML CSS
0/1
HTML Links
0/1
HTML Block & Inline
0/1
HTML Classes
0/1
HTML Id
0/1
HTML I frames
0/1
HTML Java script
0/1
HTML File paths
0/1
HTML Layout
0/1
HTML Responsive
0/1
HTML Computer Code
0/1
HTML Tutorial
About Lesson

HTML Links

In this tutorial, we will learn about hyperlink , use image and email as link in HTML with the help of examples.


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.


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:

  1. Unvisited link – it is underlined and blue.
  2. Visited link – It is underlined and purple.
  3. 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.abc.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.abc.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 : abc@gmail.com">Send mail</a>
  </body>
</html>

Output

Send mail

 

error: Content is protected !!