Loading Please Wait...
HTML links are called hyperlinks means the link is connected to another text or page. Links are found on every web page.
HTML links are helpful in navigating the website or to another webpage by just clicking on the link.
Any HTML Elements can be a link like, text, images, heading, paragraph, etc.
The HTML <a> tag is used to define a hyperlink. The href attribute is used to provide the URL or page link.
<!DOCTYPE html>
<html>
<body>
<a href="https://lynxsia.com/">Lynxsia IT Solutions</a>
</body>
</html>
By default, the links appear in the browser with the following styles.
Of course, you can style the links with CSS as per your requirements.
Following are some attribute used with <a> tag.
<!DOCTYPE html>
<html>
<body>
<a href="https://lynxsia.com/" title="Lynxsia IT Solution Website">Visit Website</a><br>
<a href="https://lynxsia.com/" target="_blank">Visit Website</a><br>
<a href="https://lynxsia.com/upload/logo/lynxsia-it-solutions-logo_1661513244.png" download>Visit Website</a><br>
<a href="https://lynxsia.com/upload/logo/lynxsia-it-solutions-logo_1661513244.png" download="logo">Visit Website</a>
</body>
</html>
Use <img> tag inside <a> tag.
<!DOCTYPE html>
<html>
<body>
<a href="https://lynxsia.com/">
<img src="https://lynxsia.com/upload/logo/lynxsia-it-solutions-logo_1661513244.png" width="100" height="100">
</a>
</body>
</html>
Use mailto: inside href attribute.
<!DOCTYPE html>
<html>
<body>
<a href="mailto:info@lynxsia.com">Send email to info@lynxsia.com</a>
</body>
</html>
Use tel: inside href attribute.
<!DOCTYPE html>
<html>
<body>
<a href="tel:07275716753">Contact us at 07275716753</a>
</body>
</html>
Use sms: inside href attribute.
<!DOCTYPE html>
<html>
<body>
<!-- For Android -->
<a href="sms:7275716753?body='Hello From Lynxsia IT Solutions'">Send SMS us at 07275716753</a>
<!-- For iOS -->
<a href="sms:7275716753;body='Hello From Lynxsia IT Solutions'">Send SMS us at 07275716753</a>
<!-- For iOS8 and plus -->
<a href="sms:7275716753&body='Hello From Lynxsia IT Solutions'">Send SMS us at 07275716753</a>
</body>
</html>
Use javascript inside href attribute.
<!DOCTYPE html>
<html>
<body>
<a href="javascript:alert('Hello')">Click Me</a>
</body>
</html>
Use onclick attribute.
<!DOCTYPE html>
<html>
<body>
<button onclick="document.location='https://lynxsia.com'">Click Me</button>
</body>
</html>
In-page linking is referred to link one element/section of a web page to another webpage. It is very useful when we have a large page and want to navigate from one page section to another.
It is achieved by <a> tag and id attribute.
<!DOCTYPE html>
<html>
<body>
<div id="navigation">
<h1>Navigation</h1>
<a href="#price">Price</a><br>
<a href="#contact">Contact</a>
</div>
<br><br><br><br><br><br>
<div id="price">
<h1>Price section heading</h1>
<p>Price section paragraph</p>
<a href="#navigation">Navigation</a>
</div>
<br><br><br><br><br><br>
<div id="contact">
<h1>Contact section heading</h1>
<p>Contact section paragraph</p>
<a href="#navigation">Navigation</a>
</div>
</body>
</html>
"#SectionID" in href link to the section of the specified id of the element. In this case "#price", and "#contact".
"#" symbol in href refers to the same page followed by the page section id. If no section-id is given then it refers to the page root section.
How you feel about this blog:
Share this blog on:
If you find any error in the turtorials, or want to share your suggestion/feedback, feel free to send us email at: info@lynxsia.com
Contact Us
We are concern with various development process like website design & development, E-commerce development, Software development, Application development, SMS & Bulk SMS Provider, PWA Development, and many more..
Copyright © , Lynxsia IT Solutions, All rights reserved