Html link tag | Html open link in new tab | Email link html

Html link tag | Html open link in new tab | Email link html 

Html link tag | Html open link in new tab | Email link html


What is the Anchor tag in HTML ? This is a question asked by many developers who are new to web developement they heard this term frequently means this property plays a important role while styling in HTML . 

By the end of this blog after reading, you can answer the question that what is anchor tag  in HTML and How to implement it and also the measures taken while applying this property ? We will learn it through examples and codes so that it will be easy to visualize.Let's get started---

 

 Hey Learners, 

Anchor tag is a HTML element that is represented by <a> and its closing tag is </a>.Anchor tag with its attribute href creates a hyperlink to webpages,files,email addresses,locations in the same page or can do anything that can done with the help of URL.

 

Content within each <a> should indicate the link's destination. If the href attribute is present, pressing the enter key while focused on the <a> element will activate it.

 

By default, links will appear as follows in all browsers:

  • If link is unvisited then link will be underlined and blue in colour.
  •  If link is  visited/clicked then link will be underlined and purple in colour.
  • An active link/lduration which link is clicked then the link is underlined and red in colour.

 

 

  •  Link That dials number:-

    To create an anchor tag that dials a number we have to put value of the attribute href  value as format -"tel:{mobile/phone number}"

    For example:-


     <p>You can call me at:</p>  
     <ul>  
      <li><a href="tel:+123456789">Phone</a></li>  
     </ul>  
    

 

  • Link That open E-mail:-

    To create an anchor tag that open an e-mail we have to put value of the attribute href  value as format -"mailto:{e-mail ID}".

    For-Example:- 

     <p>You can mail me at:</p>  
     <ul>  
      <li><a href="mailto:m.bluth@example.com">Email</a></li>  
     </ul>  
    

     

      • Link that opens page in new page:-

      To create an anchor tag that opens webpage in new page we have to put value of the attribute target  value as format -"_blank".

       

       <!DOCTYPE html>  
       <html>  
       <body>  
       <p>Open link in a new window or tab: <a href="https://www.google.com" target="_blank">Google</a></p>  
       </body>  
       </html>  
      

  •  Link that opens page in same page:-

     To create an anchor tag that opens webpage in new page we have to put value of the attribute target  value as format -"_self".

 <!DOCTYPE html>  
 <html>  
 <body>  
 <p>Open link in a same window or tab: <a href="https://www.google.com" target="_self">Google</a></p>  
 </body>  
 </html>  
  I have injected live server of the code :-

See the Pen Untitled by Himanshu Singh (@himanishu) on CodePen.


I hope hoped loved this blog and learnt many things at a place please let us know your review in the comment section if you liked it please comment below as it will give us motivation to create more blogs.

If you faced any difficulty feel free to comment down your problems and If you really liked it, please show your love in the comment section this really motivates a blogger to provide more such content.

You can follow me on Instagram.

Written by @Himanshu Singh.

Post a Comment

Previous Post Next Post