HTML Links
Hello Students Welcome to our new blog in this blog you will learn about Html Link With Examples. So must check the full blog.
HTML links or hyperlinks connect one resource on the web to another. The resource may be an image, a web page, a program, a video clip, an audio clip, an element within a web page, etc, or anything that can be hosted on the internet.
We use the HTML <a> tag to create hyperlinks. The syntax for the <a> tag is
<a href=”URL”> Text </a>
Here,
- URL- the destination of the link
- Text- the part that will be visible as a link
Clicking on the text will navigate you to the resource in the URL. For example,
<a href=”https://careersknowledge.in/introduction-to-html-head-body> HTML Notes </a>
Browser Output
HTML Notes
Image Links
You can insert almost any content inside a <a> tag to make it a link. Hence, we can also use images as a link.
<a href=”https://careersknowledge.in/“>
<img src=”logo.png” alt=”careersknowledge Logo”>
</a>
target Attribute
By default, any link clicked will open in the same browser window. This may lead to a bad user experience. This is where the target attribute becomes useful. For example,
<a href=”https://careersknowledge.in/ ” target=”_blank”>Programiz</a>
Here, target= “_blank” opens the link in a new browser tab.
We use the target attribute to specify where the link is opened. The target attribute has 4 values.
Target | Description |
_self | (Default) Opens the link in the same browser tab. |
_blank | Opens the link in a new browser tab. |
_parent | Opens the link in the parent frame. |
_top | Opens the link in the current tab window (topmost parent). |
download Attribute
When linking to a web resource, we can specify that the resource is to be downloaded by using the download attribute. For example,
<a href=”/files/logo.png” download> Download Image </a>
Browser Output
Download Image
When the link is clicked, the file from /files/logo.png will be downloaded.
We can also provide an optional value to the download attribute. This value will be set as the filename of the downloaded resource. For example,
<a href=”/files/logo.png” download=”Programiz”>Download Image</a>
Here, the link is the same as the previous example, however, when downloading, the file will have the name Programiz.png rather than the previous original name logo.png.
Linking to an HTML element
As previously mentioned, along with linking to web sources, an <a> tag can also link to a respecific element within the web page. We use that by adding # to the URL followed by the id of the specific element. For example,
Link to an element in the same webpage:
<a href=”#title”>Go to Title</a>
Here, clicking on this link will scroll the web page to the element with the id of title
Link to an element in another webpage:
Email and Call links
We can also use HTML links as email links and call links to help users contact us or someone else using their email client or call app.
Email links:
The email link opens the user’s default mail client to make it easier for the user to send mail to a specific address. For example,
<a href=”mailto:name@domain.com” > Send Mail </a>
Call links:
Similar to email links, we can create call links to trigger the user’s call app with a phone number. For example,
<a href=”tel:+919898989896″> Call Us </a>
Thanks For Reading the Article. I hope you will understand the topic Html Link With Examples Well.
For Live Class Subscribe Our Youtube Channel link is given below
https://www.youtube.com/@olevelguruji
Also Check out Latest Uploads
HTML Formatting Tags With Examples
Introduction To Html head body tag with attribute
Incredible! This blog looks exactly like my old one!
It’s on a completely different subject but it has pretty much the same page layout
and design. Excellent choice of colors!