Links
In HTML, links (also called hyperlinks) allow users to navigate between different web pages or external resources. They are created using the <a>
(anchor) tag, which can point to another webpage, file, or location within the current document.
Syntax
<a href="url">Link Text</a>
href
: Specifies the destination URL.Link Text
: The clickable text shown to users.
Link Appearance
By default, links will appear as follows in most browsers:
- Unvisited links are underlined and blue
- Visited links are underlined and purple
- Active links (during click) are underlined and red
Example
Text wrapped in a linked anchor tag becomes a hyperlink to another page:
<!-- Creating a link --><a href="https://www.codecademy.com/learn">My Home</a>
The output of the example code will look like this:
Types of Links
1. Internal Links
Points to a page within the same website.
<!-- Creating a text link --><a href="#data-science-jobs">Data science jobs</a>
The output of the example code will look like this:
2. External Link
Points to a web page on a different domain.
<a href="https://example.com">External Site</a>
3. Image Links
Anything that is inside the anchor tag will be treated as a link. In this case, the Codecademy logo will take the user to the Codecademy home page.
<!-- Creating an image link --><a href="http://www.codecademy.com"><img src="logo.jpg" alt="Codecademy Logo" /></a>
The result of the example code will appear as:
4. Email and Phone Links
Special strings can be passed to the href
attribute to link email accounts ("mailto:[email protected]"
) or phone numbers ("tel:###-###-####"
):
<!-- This link will try to create a new email to [email protected]. --><!-- This link will try to call phone number 234-555-1212. --><a href="tel:234-555-1212">234-555-1212</a>
The actions defined by these links will be completed depending on the user’s device and settings. For example, clicking a phone link while on a cell phone may use the built in dialer to complete the call.
Frequently Asked Questions
1. What does the target="_blank"
attribute do?
It opens the link in a new browser tab or window.
2. Can I link to a file like a PDF or image?
Yes. The href
attribute can link to any resource, including documents or images.
<a href="files/resume.pdf">Download Resume</a>
3. How do I link to another section on the same page?
Use href="#section-id"
where the section has a corresponding id
attribute.
All contributors
- BrandonDusch
- christian.dinh
- Anonymous contributor
- Anonymous contributor
- Anonymous contributor
Contribute to Docs
- Learn more about how to get involved.
- Edit this page on GitHub to fix an error or make an improvement.
- Submit feedback to let us know how we can improve Docs.
Learn HTML on Codecademy
- Career path
Front-End Engineer
Front-end engineers work closely with designers to make websites beautiful, functional, and fast.Includes 34 CoursesWith Professional CertificationBeginner Friendly115 hours - Free course
Learn HTML
Start at the beginning by learning HTML basics — an important foundation for building and editing web pages.Beginner Friendly7 hours