Attributes Of Anchor Tag In HTML
Last Updated : Mar 11, 2024
IN - HTML | Written & Updated By - Pragati
In this tutorial we will show you the solution of attributes of anchor tag in HTML, in HTML there are many tags which we use in html to make a website. But as we know a website is that which collection of many webpages is.
There are some tags which allow html files to link with each other, so that fundamentals of a website does not changes.
For this, there is a tag known as anchor tag, which is mostly used to link html files inside body, this tag is also used to links audios, videos, images, other webpages and other things like pdf, etc. which you want to link.
Step By Step Guide On Attributes Of Anchor Tag In HTML :-
As, anchor tag is used to link files each other. As genuinely, it creates a link which may be a text, image on which you click and it directs to the page which is links behind the tag.
Also, anchor tag handles many responsibilities so it has many properties and attributes which are used with thus tag to enhance its use.
Here, today we will show you that how many attributes are used with anchor tag and what is the work of them in there.
<!DOCTYPE html> <html> <head> <title> Title of the document<title> </head> <body> <!-- how to open link in a new browser --> <a href="http://www.google.com" target="_blank" rel="noopener noreferrer">Click here to open google on new tab</a> <br><br> <!-- example to link phone number in link --> <a href="tel:+911234567890">click to call, a number is linked inside this</a> <br><br> <!-- example to link an email address in link --> <a href="mailto:talkerscode@gmail.com"> click to mail</a> <br><br> <!-- this is an example to use image as a link --> <a href="http://www.facebook.com"> <img src=facebook_image.jpeg" alt=" image" width="100" height="100"> </a> </body> </html>
- First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
- Secondly, the <html> tag is used to indicate the beginning of an HTML document.
- As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively.
- Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here.
- In the body tag, we create for anchor tags that are different from each other. In first one, target blank is used with the help of which when you click on this link, the destination link will be open on next new tab.
- After this we use phone number and email in link with the help of href attribute. With help of this when you click on links you directly done a call or able to send email on respective links.
- In the last step, we link an image in link tag. And when you click on this image showed on webpage, you will be directly send to the page or link that is attached behind this link.
- At last, the <body> and <html> tags are closed with </body> and </html> respectively.
Other attributes of anchor tag:
There are many attributes which are used in anchor tag. Their names are like hreflang, download, target, type, etc. Let us understand each briefly:
- Hreflang: This is used to specify the language of the linked document. Its value is according to the linked document.
- The second one used is named as download. The value given to this attribute is document name. It may be a video, audio, or may be a pdf like. This is used where the user able to directly download the file when he/she click on the hyperlink.
- The third attribute used is known as target. It have many values and used to provide the location of document which will open after link on link. Its values are like _blank, _parent, _self and _top.
- The fourth attribute used in anchor tag is type. it used to define the type of the document linked with the help of href attribute. In values, you specify what type of document you linked.
- Now, the last and main attribute which we use in anchor tag is href. This is the main attribute of anchor tag and in this attribute you have to specify the file name with extension in this attribute as value. You can also give the location with file name. This attribute is used to link the anchor tag and the file which you linked.
Conclusion :-
In conclusion, here we can say that there are many attributes used in anchor tag, but the example here contains the attributes that are most commonly used in html.
We also specify other attributes, which are discussed in brief one by one with proper understanding. I hope this tutorial on attributes of anchor tag in HTML helps you.
About Pragati
