HTML Anchor tag
HTML (Hypertext Markup Language) is a markup language used for creating web pages. The anchor tag is an essential part of HTML, which allows you to create hyperlinks to other pages or sections within the same page. In this article, we’ll cover everything you need to know about the HTML anchor tag.
What is the HTML anchor tag?
The anchor tag is an HTML element that allows you to create a hyperlink to another web page, document, or a specific section of a web page. The anchor tag is defined using the “<a>” tag, followed by the hyperlink URL in the “href” attribute.
<a href="https://example.com">Link text goes here</a>
In the above example, the “href” attribute specifies the URL of the destination page, while the “Link text goes here” is the text that the user clicks on to follow the hyperlink.
How to use the HTML anchor tag
To use the HTML anchor tag, you need to follow a few steps:
Step 1: Start with the “<a>” tag and the “href” attribute
Step 2: Add the text that the user will click on to follow the hyperlink
<a href="https://example.com">Click here to visit Example.com</a>
Step 3: Close the anchor tag
In the above example, the user will click on “Click here to visit Example.com” to follow the hyperlink and navigate to the specified URL.
Anchor tag attributes
In addition to the “href” attribute, there are several other attributes that you can use with the anchor tag:
- “target”: This attribute specifies where to open the destination URL. For example, “_blank” will open the URL in a new browser window or tab.
<a href="https://example.com" target="_blank">Visit Example.com</a>
- “title”: This attribute provides a tooltip when the user hovers over the link.
<a href="https://example.com" title="Visit Example.com">Example.com</a>
- “rel”: This attribute specifies the relationship between the current document and the linked document.
<a href="https://example.com" rel="nofollow">Visit Example.com</a>
- “download”: This attribute prompts the user to download the destination file instead of navigating to it.
<a href="https://example.com/example.pdf" download>Download PDF</a>
Linking to a specific section within a web page
In addition to linking to a different page, you can also use the anchor tag to link to a specific section within the same page. To do this, you need to use an anchor tag with an “id” attribute on the target section.
<a href="#section2">Jump to section 2</a> ... <h2 id="section2">Section 2</h2>
In the above example, clicking on the “Jump to section 2” link will scroll the page to the “Section 2” heading.
The HTML anchor tag is an essential part of creating web pages. It allows you to create hyperlinks to other pages or sections within the same page, making it easy for users to navigate through your content. By using the anchor tag attributes, you can customize your hyperlinks and provide additional functionality, such as opening the
HTML anchor tag marks the text as a hypertext link.
Some of the attribute of the anchor element are:
HTML Anchor HREF
Anchor HREF attribute link the document with the text or images define in the block
HTML Anchor NAME
Anchor name attribute allow to give name to anchor .Not supported in HTML 5 use Id attribute instead of name. HTML Anchor TITLE
Anchor title attribute show the information about the link in small box while the mouse is over the anchor ,or image, plain text etc.
HTML Anchor TARGET
Anchor target attribute define where the document will be open.
An anchor tag is define as
Example for HTML Anchor Tag
<!Doctype HTML> <html> <Head> <Title>Your Web site Title</Title> </Head> <a HREF="http://www.w3htmlschool.com/">Open w3htmlschool.com </a> Document Include Here </html>