anchor tag in html

HTML Links and Anchor tag <a> is used in HTML to add hyperlinks in the web page which is used to jump to another page, an email address or any other URL.
The href attribute of the anchor tag defines the hyperlink’s destination.

For Example :

<h6>Hyperlink</h6>
<a href="https://technobrainz.in/">Visit TechnoBrainz.com!</a>

Output :

Hyperlink

Visit TechnoBrainz.com!

In HTML, by default the HTML link is open in the same tab. However you can change it using the target attribute.
target attribute of the anchor tag can attain four values :

  • _self – It is the default value of target. Opens the URL in the same tab in which it was clicked.
  • _blank – It opens the URL in the new tab.
  • _parent – It opens the URL in the parent frame.
  • _top – It opens the URL in the full body of the tab in which it was clicked.

For Example :

<h6>Hyperlink</h6>
<a href="https://technobrainz.in/" target="_blank">Visit TechnoBrainz.com!</a>

Output :

Hyperlink

Visit TechnoBrainz.com!

Absolute Links and Relative Links :

  • Absolute URL refers to the full web address in the href attribute
  • Relative URL refers to a link to a page within a same website. It does not have “https://www” part.

Button as a Link :

For Example :

<h6>Button as a Link</h6>

<p>Click the button to visit Techno Brainz</p>

<button onclick="document.location='https://technobrainz.in/'">Techno Brainz</button>

Output :

Button as a Link

Click the button to visit Techno Brainz


Email Address as a Link :

  • mailto: is used inside the href attribute to create a link that opens the given email address to send a new email.

For Example :

<h1>Email as a Link</h1>
<p><a href="mailto:abc@gmail.com">Send email</a></p>

Output :

Email as a Link

Send email

Image as a Link :

Use <img> tag inside the <a> tag to use an image as a link.

For Example :

<h6>Image as a Link</h6>
<a href="https://technobrainz.in/"><img src="smiley.gif" alt="HTML tutorial" style="width:42px;height:42px;"></a>
<p>Thanks</p?

Output :

Image as a Link
HTML tutorial

Note :-

Watch HTML Links and Anchor Tag video on YouTube – Click here
HTML Lists – click here
HTML Text Formatting Tags :– click here