HTML Anchor

You might know that hyperlink which is a powerful means of browsing from web pages and websites. It is developed for sending the readers or those who will perform surfing from one web page to another without opening new tab or window. This is in general term said to as link and is given a reference to jump to another page or document or from one part of the same page to another using a hypertext. So, now the question is what a hypertext is?

Hypertext can be defined as a text shown on your PC screen which holds the hyperlink data (here data means from which document to which document, it will move) and hence take the readers to different web pages by clicking it. In this chapter, you will be learning about how to create your very own hyperlink and use them in creating your website and web pages.

What is Anchor Tag?

The Anchor tag in HTML can be defined as a means to create a hyperlink which can link your current page on which the text is being converted to hypertext via <a> (anchor tag) to another page. This anchoring from one page to another is made possible by the attribute "href", which can be abbreviated as (hypertext reference).

HREF attribute

The attribute 'HREF' of the Anchor tag is implemented for defining the address or path to which this hypertext will get linked. In other words, it can be said that it directs you out of your page to that destination page, whose link you have mentioned within the double quotes of href attribute as value.

The syntax for an anchor tag with href attribute looks something like this:

<a href = "URL">Text Here</a>

Appearance of HTML <a> tag

Since Anchor tags are used for giving hyperlinks, you might have noticed that they change color based on certain situations, such as unvisited, clicked, visited, etc. Let's see their color code with respect to their activity:

  • A link which is unvisited gets displayed with properties like underlined and color is blue
  • A link which is visited gets displayed as underlined with color as purple
  • A link which is active link gets displayed as underlined with red color

Still, there are many web developers who will deposit their own link-colors in their web pages to match the color scheme of their site. Here's the format:

<body bgcolor="red" text="yellow" link="blue" alink = "#FFFF00" vlink ="#FF00FF">

You can also provide hex code for colors as well (as you can see from the above example) or else you can use specific words for each color which is acceptable by the browser.

Program for Anchor Tag

<html>
<body>

<a href="https://www.w3schools.in/" >Welcome to w3schools</a>

</body>
</html>

Anchor in Images

Anchor tags can also be used to create hyperlink through images also. Here's a code snippet to show how to perform that.

<html>
<body>

<a href="https://www.example.com/"><img src ="logo.jpg"></a>

</body>
</html>

Courses
Subscribe Updates via Email

Join 49,000+ W3schools lovers and get all the latest tutorials, programs, algorithms in your inbox.