Summary -

In this topic, we described about the <a> tag along with detailed example.

HTML links are defined by using <a> tag. The <a> tag adds the 'a' element to a web page. <a> tag called as Anchor. The 'a' element creates a hypertext anchor (hyperlink) from one page to another.

To use the <a> tag, place the text in between the opening and closing <a></a> tags. Attributes used to specify more information along with <a> tag. The link destination should specify in href of <a> tag. URL needs to provide when by using the href attribute.

If attribute not included, the <a> element will be simply place holder. An anchor does not need to be defined with a tag. Applying the id attribute to any tag will achieve anchor.

By default, links will appear as below without override -

  • An unvisited link is underlined and blue
  • A visited link is underlined and purple
  • An active link is underlined and red

Syntax -

<a href=” “>.. text/image here.. </a>

Optional Attributes -

AttributeDescriptionValues
charsetSpecifies the character set of a linked document<font color="red">Not supported in HTML5</font>Char_encoding
coordsSpecifies the coordinates of a link<font color="red">Not supported in HTML5</font>Coordinates
downloadSpecifies the target should be downloaded instead of navigated to.<font color="green">HTML5 attribute</font>None.
hrefSpecifies the target destination of a link.URL.
hreflangSpecifies the language of the target link. This attribute can be used if href is used.<font color="green">HTML5 attribute</font> Language code
MediaSpecifies media/device the linked document is optimized.<font color="green">HTML5 attribute</font>media_query
NameSpecifies the name of the anchor.<font color="red">Not supported in HTML5</font>name
relSpecifies the relationship between the link’s page and the link’s target destination. alternate: Indicates an alternative version of the current web page.
author: Indicates author of the page / article.
bookmark: link to the current section of the page.
help: Indicates the Help specific to the context.
license: Indicates copyright license for the current document.
next: Indicates the linked next page in the sequence.
nofollow: Indicates the linked resource is not certified by the current document’s author.
noreferrer: Indicates the browser not to send an HTTP referrer header.
prefetch: Indicates the linked resource should be cached.
prev: Indicates the linked previous page in the sequence.
search: Indicates the search facility used to search the current, and related, documents.
tag: A tagging term that applies to the link.
ShapeSpecifies the shape of the link<font color="red">Not supported in HTML5</font>default
rect
circle
poly
targetSpecifies in which the target destination should open. _self: Opens link in current window / tab.
_blank: Opens link in a new window / tab.
typeSpecifies type of the linked resource.Text.
Note! Download, hreflang, media, rel, target, and type cannot be specified if the href attribute is not present.
A linked page is normally displayed in the current browser window, unless you specify another target.

Example -

<!DOCTYPE html>
<html>
	<head>
		<title>HTML link tag example</title>
	</head>
	<body>
		<a href="https://www.">Home Page</a> 
	</body>
</html>

Output -