Scribd
Upload
7 views

HTML Class 05

Uploaded by

zoom1
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
7 views

HTML Class 05

Uploaded by

zoom1
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 3

The HTML <a> Tag – Anchor Tag

Example Code

HTML( Hyper Text Markup Language) is one of the languages we


use to create web applications. It adds structure to your web pages.
HTML has various tags we use to create elements. And
multiple elements come together to create meaningful web
pages and applications.

The anchor tag is one of the most used and well-known tags
in HTML. we will learn about the anchor tag (<a>) and its
main uses with many examples.
But why talk about the anchor tag if it is already well-known?
There are a few essential details of this tag that many devs
don't know - but they should. So let's learn them.

I have created an app to demonstrate different behaviors of


the anchor tag.

What is the Anchor Tag in HTML?


The primary purpose of an anchor tag is to link one page to
another page or to a section of the same page. The anchor
tag is also known as a HyperLink. Like any other HTML tags,
you use the following construct to create an anchor tag:
<a>My Website</a>
The above anchor tag is a valid HTML tag, but it doesn't do
much other than act as a placeholder. Let's use this anchor
tag to link to a web page. You need to use the href attribute
to link to another page.
<a href="https://tapasadhikary.com">My Website</a>
The value of the href attribute is usually a URL pointing to a
web page (like the one above). You can also link another
HTML element or a protocol (for example, sending email),
and you can execute JavaScript using the href attribute. We
will see the examples of how to do all this below.
Anchor Tag Uses with Examples
Along with href, there are other vital attributes that make the
anchor tag useful. Let's learn about them with examples.
How to link to a section of the page
We have seen how to link to an external web page (website).
But you can also link to a section of the same page by linking
to an element using its id. Assume our page has a div section
with the id news.
<div id="news">
<h2>News</h2>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Sed non risus. Suspendisse lectus tortor, dignissim sit
amet,
adipiscing nec, ultricies sed, dolor. Lorem ipsum dolor sit
amet,
consectetur adipiscing elit.
</p>
</div>
You can now link to this section (div) using the anchor tag. To
do that, just use the id of the section with a # as the prefix for
the href value.
<a href="#news">Go</a>
So, when you click on the Go link, you will scroll to the news
section of the page.

You might also like