 |
| Html Hyperlink tag |
Html hyperlink tag uses to move from one page to another
page. Html hyperlink target to a page open new window or existing window.
Page’s links provide to hyperlink
href. The html hyperlink clickable and by default hyperlink color is blue.
Html hyperlink tag.
In HTML hyperlink are represent by anchor tag <a>. This
tag use to move from one page to another page.
We can use an image and button as a link.
Html hyperlink tag example
Following example show how to hyperlink is used. To understand hyperlink
working we need to create two pages. One page (Parent Page) and second (Child
Page). Let see the code.
Code: Parent page or index
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML Hyperlink</title>
</head>
<body>
<h3>This Main or Parent Page</h3>
<a href="child_page.html">Go to Child Page</a>
</body>
</html>
Code: Child Page
<!DOCTYPE html>
<html lang="en">
<head>
<title>Child Page</title>
</head>
<body>
<h3>Hi, This is Child Page. </h3>
<a href="index.html">Go to Parent Page</a>
</body>
</html>
Parent page has information about child page and child page also
have information about parent page.
<a href="child_page.html">Go to Child Page</a>//Parent
Page information about child page
<a href="index.html">Go to Parent Page</a>//child
page information about parent page.
Result: Parent Page
 |
| HyperLink Example 1 |
Result: Child Page
 |
| HyperLink Example 2 |
When you click on Go to Child then you will move form
parent to child page. When you on child page then you click on Go to Parent then
you will move from child to parent page.
Html hyperlink color
By default, hyperlink color blue and underline. We can change
color and apply new style by CSS. Let’s look how we will change.
Code: Parent Page
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML Hyperlink</title>
<style>
a{
background-color: #757D75;
color: #FCC9B9;
padding: 10px;
text-decoration: none;
font-weight: bold;
font-style: italic;
border-radius: 20px;
}
</style>
</head>
<body>
<h3>This Main or Parent Page</h3>
<a href="child_page.html">Go to Child Page</a>
</body>
</html>
Result: Parent Page
 |
| HyperLink Example 3 |
Code: Child Page
Result: Child Page
 |
| HyperLink Example 3 |
Html hyperlink target
Target means where another page will move. We can target a page
on the new window, a new window to parent, if we use frame then override frame. There
are four types
1.
_self
2.
_blank
3.
_top
4.
_parent
By default, the browser page opens in _self. _blank use for a new window. _parent
uses to open the page in the parent frame. A new page will open on the parent page. _top
use in to override frame.
<a href="child_page.html" target="_blank">Go to Child Page</a>
This code shows how to use target.
Html hyperlink href
Href holds destination information. When the user clicks on a hyperlink
then its moves to the destination address.
If we use mailto:abc123@gmail.com
then we able to send mail.
<a href="mailto:abc123@gmail.com" target="_blank">Go to Mail</a>
0 Comments
Thanks