HTML <a> Tag

The <a> tag (anchor tag) in HTML is used to create a hyperlink on the webpage. An anchor tag requires the href attribute which specifies the URL to be linked to.

HTML Links – Syntax

<a href="url">link text</a>

The link text is the part that will be visible to the reader.

href attribute of HTML anchor tag

The href attribute is used to define the address of the file to be linked. In other words, it indicates the link’s destination.

Href stands for hypertext reference.

HTML anchor tag example

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>HTML anchor tag example</title>
</head>

<body>
    <h1>
        Welcome to
        <a href="https://www.thenewtutorial.com/">
          TheNewTutorial.com
        </a>
      </h1>
      <h2>This is anchor Tag</h2>
</body>

</html>
HTML anchor tag example

What is use of hyperlink?

Hyperlink is used to link the webpage to other webpages as well as files, location, or any URL.

The link can wrap around text, images, or as buttons, so that users can interact with it and visit the link’s destination.

By default, links will appear as follows in all browsers:

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

You can click on a link and jump to another document.

A link does not have to be text. A link can be an image, button or any other HTML element!

When you move the mouse over a link, the mouse arrow will turn into a little hand.

HTML Links – The target Attribute

By default, the linked page will be displayed in the current browser window. You can change this behavior by using target attribute.

The target attribute specifies how the destination page or the target document should be opened.

'target' attribute can have one of the following values:

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

HTML anchor tag target attribute example

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>HTML anchor tag target attribute example</title>
</head>

<body>
    <h1>
        Welcome to
        <a href="https://www.thenewtutorial.com/" target="_blank">
          TheNewTutorial.com
        </a>
      </h1>
      <h2>Above link will open in new tab.</h2>
</body>

</html>