• Home
• Web Tutorial
• Full Course
• English Tutorial
• HTML
• HTML Basic
• HTML Text Links

Example of HTML Links

Following is example of HTML Text Link

index.html

<a href="https://horje.com">
This is a link</a>

Output should be:

Definition of HTML Text Link

HTML Links - The target Attribute

By default, the linked page will be displayed in the current browser window. To change this, you must specify another target for the link.

The target attribute specifies where to open the linked document.

The target attribute can have one of the following values:

• _self - Default. Opens the document in the same window/tab as it was clicked
• _blank - Opens the document in a new window or tab
• _parent - Opens the document in the parent frame
• _top - Opens the document in the full body of the window

index.html

<a href="https://horje.com" target="_blank">Visit Horje!</a>

Output should be:

Absolute URLs vs. Relative URLs

Both examples above are using an absolute URL (a full web address) in the href attribute.

A local link (a link to a page within the same website) is specified with a relative URL (without the "https://www" part).

index.html

<h2>Absolute URLs</h2>
<p><a href="https://www.w3.org/" target="_blank">W3C</a></p>
<p><a href="https://www.google.com/" target="_blank">Google</a></p>
<h2>Relative URLs</h2>
<p><a href="html_images.asp">HTML Images</a></p>
<p><a href="/css/default.asp">CSS Tutorial</a></p>

Output should be:

HTML Links - Use an Image as a Link

To use an image as a link, just put the <img> tag inside the <a> tag.

index.html

<a href="https://horje.com/avatar.png">
<img src="https://horje.com/avatar.png" alt="HTML tutorial" style="width:42px;height:42px;">
</a>

Output should be:

HTML Link to an Email Address

Use mailto: inside the href attribute to create a link that opens the user's email program (to let them send a new email):

index.html

<a href="mailto:[email protected]">
Send email</a>

Output should be:

HTML Button as a Link

To use an HTML button as a link, you have to add some JavaScript code.

JavaScript allows you to specify what happens at certain events, such as a click of a button.

index.html

<button onclick="document.location='default.asp'">
HTML Tutorial</button>

Output should be:

HTML Link Titles

The title attribute specifies extra information about an element. The information is most often shown as a tooltip text when the mouse moves over the element.

index.html

<a href="https://horje.com" title="Go to Horje HTML section">Visit our HTML Tutorial</a>

Output should be:

HTML Absolute URLs

It means a full URL to link to a web page.

index.html

<a href="https:/horje.com">HTML tutorial</a>

Output should be:

HTML Relative URLs

It means Link to a page located in the html folder on the current web site

index.html

<a href="/html/default.asp">HTML tutorial</a>

Output should be:

Chapter Summary of HTML Links

• Use the <a> element to define a link
• Use the href attribute to define the link address
• Use the target attribute to define where to open the linked document
• Use the <img> element (inside <a> ) to use an image as a link
• Use the mailto: scheme inside the href attribute to create a link that opens the user's email program

Read Article

https://horje.com/learn/1434/reference