HTML link attributes tell the browser how a link works. They set where the link goes, how it opens, and what extra details it adds.
What are HTML Link Attributes?
The HTML link attribute is part of the <a> tag. It defines link behavior. It controls how the link loads and what data it sends to the browser.
Here is the syntax you need to know:
<a href="URL" [attribute]=["value"]>Link Text</a>Here is an example:
<a href="https://example.com" target="_blank">Visit Site</a>This code sets a link that opens in a new tab.
Here are the commonly used link attributes:
- href sets the link destination.
- target controls how the link opens.
- rel sets the relation between the current page and the target.
- download tells the browser to download the file.
So, what are the differences between internal and external link attributes?
Internal links point to pages on the same site. External links point to other sites.
The internal link uses a short path like /about.html and keeps the visitor in the same domain.
An external link uses a full URL like https://news.com/page.html. It sends the visitor outside the site.
Examples of Link Attributes in HTML
Internal link with href:
<a href="/about.html">About Us</a>This link sends the user to the about page on the same site and keeps the navigation smooth and does not load a new tab.
External link with target:
<a href="https://example.com" target="_blank">Visit Example</a>This link sends the user to another site. It opens in a new tab so the current page stays in place. This is common for outside resources.
Link with rel attribute:
<a href="https://othersite.com" rel="nofollow">External Resource</a>This link goes to an external page. The rel attribute tells search engines not to pass ranking to this site. It is often used for sponsored or untrusted links.
Link with download attribute:
<a href="/files/report.pdf" download="AnnualReport.pdf">Download Report</a>This link points to a file. The browser does not open it. Instead, it downloads the file and saves it with the given name.
Wrapping Up
You learned what HTML link attributes are and how they work. You also saw the difference between internal and external links.
Here is a quick recap:
- Use
hrefto set the link path. - Use
targetto control how the link opens. - Use
relto mark a relation or block search flow. - Use
downloadto force file download.
FAQs
What are the most common HTML link attributes?
- href - defines the link destination
- target - controls where to open link
- rel - defines link relationship
- download - forces file download
<a href="https://example.com" target="_blank" rel="noopener">Visit</a>How do you open a link in a new tab using HTML?
<a href="https://google.com" target="_blank">Google</a>target="_blank" makes the link open in a new browser tab.
What does the rel attribute do in HTML links?
- rel="nofollow" - tells search engines not to pass ranking
- rel="noopener" - prevents security risks
- rel="sponsored" - marks paid links
<a href="https://ads.com" rel="sponsored">Ad Link</a>How can you force a link to download a file?
<a href="file.pdf" download>Download PDF</a>download attribute tells the browser to save the file instead of opening it.Similar Reads
The HTML input tag lets you add fields for user data in forms. You use this tag to collect text,…
The HTML <var> tag marks a word or phrase as a variable in a document. Web authors use it to…
In this article, you will learn what HTML meta tags are and how they work. You also see how they…
You need images to show products or ideas on your site. The HTML img tag places those images on the…
The HTML time Tag marks time values in a document. Use it to show dates or times that machines and…
HTML form validation attributes help you check the form data before it reaches the server. What Are HTML Form Validation…
The <ins> tag in HTML shows text that the author added after the original content. This helps readers know what…
The <wbr> tag in HTML helps the browser decide where it can break a word. It does not force a…
The <dialog> tag is used to build modal popups in HTML. It shows alerts and messages without third-party scripts. Understand…
The sub tag in HTML shows text in subscript form. It places the text slightly below the normal baseline of…
