Hyperlink

A hyperlink refer to as link.It refers to linking to another web page or to a section in the same web page.The A(anchor) element is used to create a HYPERLINK.you can specify a text or an image as a hyperlink.

Syntax

<a href="url">link text</a>


Example

<html>
<head>
<title>Hyperlink</title>
</head>
<body>
<p>Click following link</p>
<a href="https://www.mktutorial.in/">Click Me</a>
</body>
</head>
</html>

output

Hyperlink

Click following link

Click Me

Target Attribute

The Target attribute of the A element specifies the location where the linked web page will open when a link is clicked.

Target Attribute
value Description
_blank Loads the target URL in the new blank window
_self Loads the target URL in the same window as that of the current web page.
_top Loads the target URL in the complete area of window
_parent Opens the linked document in the parent frame.

<html>
<head>
<title>Hyperlink Example</title>
<base href = "https://www.mktutorial.in/">
</head>
<body>
<p>Click any of the following links</p>
<a href="/html/index.html" target = "_blank">Opens in New</a>
<a href="/html/index.html" target = "_self">Opens in Self</a>
<a href="/html/index.html" target = "_parent">Opens in parent</a>
<a href="/html/index.html" target = "_top">Opens in Body</a>
</body>
</head>
</html>

Target Example

Hyperlink Example

Click any of the following links

Opens in New | Opens in Self | Opens in Parent | Opens in Body



Use of Base Path

When you link HTML documents related to the same website, it is not required to give a complete URL for every link. You can get rid of it if you use tag in your HTML document header. This tag is used to give a base path for all the links. So your browser will concatenate given relative path to this base path and will make a complete URL.

Example

Following example makes use of tag to specify base URL and later we can use relative path to all the links instead of giving complete URL for every link.
<html>
<head>
<title>Hyperlink Example</title>
<base href = "https://www.mktutorial.in/"> </head>
<body>
<p>Click any of the following links</p>
<a href="/html/index.html" target = "_blank">Opens in New</a>
</body>
</head>
</html>
Hyperlink Example

Click following link

HTML Tutorial -->

Absolute and Relative Paths

Absolute Path

Absolute paths are links that contain the complete address to get to web page.

Syntax

<h2>Absolute URLs</h2>
<p><a href="https://www.mktutorial.in/">mktutorial</a></p>
<p><a href="https://www.google.com/">Google</a>

Syntax

<h5>Relative Paths</h5>
<p>Relative paths are links that are provided when the files of a web page are in the same folder.</p>
<p><a href="html_images.asp">HTML Images</a></p> <p><a href="/css/default.asp">CSS Tutorial</a></p>