To use HTML links we first need to understand what HTML links are.
Html Links are used to go from one page to another. They are also called Hyperlinks. It allows the user to click and then redirect to another page. It is a text or an image you can click on, and jump to another document.
<a href=”URL” > Link Name </a>
<a href="https://www.beginnersheap.com/"> Beginners heap </a>
- href: is the destination or URL of the going page.
- Link Name: is the name or visible text.
Links are of two types:
- Absolute Link
- Relative Link
Absolute links are the complete web address of the destination page.
<a href="www.beginnersheap.com">Beginners Heap</a>
Relative link have (link to a same website) relative address of the destination page.
<a href="home.html"> Home </a>
while working on your own website, relative links are used, as to move within the directories. we use
to go into the directory
Suppose that you have HTML page within a folder named aboutAuthers and HTML page about.html is placed in that folder. and you are working in index.html. To access about.html in folder
<a href="aboutAuthers/about.html">About Authers</a>
HTML Links Colors
When you move the mouse over a link, two things will normally happen:
- The mouse arrow will turn into a little hand
- The color of the link element will change.
By default, a link will appear (in all browsers):
- An unvisited link is underlined and blue
- A visited link is underlined and purple
- An active link is underlined and red
Target: it specifies where to open the linked document.
<a href="home.html" target="_blank">Home</a>
Target Attribute Values
- _blank: it opens the linked document in new window or in new tab.
- _self: it opens the linked document in same frame.
- _parent: it opens the linked document in parent frame.
- _top: it opens the linked document in full body of the window.
- Frame name: it opens the linked document in that frame.
Image as Link:
<a href="https://www.beginnersheap.com"><img src="BeginnersHeapLogo.jpg"/></a>
Click the image to open link place behind the image.
Link attribute can also have an id or a class. It is an inline element that is used within html body.