How to use href attribute in HTML Page?


The href attribute specifies the URL of the page the link goes to (href attribute specifies the link's destination).

We should use href attribute with <a> tag so it will be a hyperlink. This <a> tag should be used inside the <body>…</body> tags.

Syntax

Following is the syntax for the <a> tag, which uses href attribute to specify the link address.

<a href="link address">link text</a>

Example

Following is the example program to use href attribute in an HTML page.

<!DOCTYPE html> <html> <body> <p><a href="https://www.Brave.com">Click this to navigate to the Brave home page</a></p> </body> </html>

How to link a section of the same page?

We can link a section of the same page by using the below syntax.

Syntax

Following is the syntax to link a section of the same web page.

<a href="#section id">heading of the section</a>

Example

Following is the example for linking a section of the same web page.

<!DOCTYPE html> <html> <body> <a href="#RAJYA SABHA">RAJYA SABHA</a> <h3>LOK SABHA</h3> <p>Lok Sabha is composed of representatives of the people chosen by direct election. <br> The maximum strength of the House of the Constitution is 552,<br> which is made up by election of upto 530 members to represent the States, <br> upto 20 members to represent the Union Territories and not more than two members of the <br> Anglo-Indian Community to be nominated by the Hon'ble President.</p> <h3 id="RAJYA SABHA">RAJYA SABHA</h3> <p>The ‘Council of States’ which is also known as Rajya Sabha,<br> a nomenclature that was announced by the chair in the House on the 23rd August, <br> 1954 has its own distinctive features.<br> The origin of the second Chamber can be traced to the Montague-Chelmsford Report of 1918. <br>The Government of India Act, <br>1919 provided for the creation of a ‘Council of State’ as a second chamber of the then legislature <br> with a restricted franchise which actually came into existence in 1921.<br> The Governor-General was the ex-officio President of the then Council of State. The Government of India Act,<br> 1935, hardly made any changes in its composition.</p> </body> </html>

When we click on the Rajya sabha, it will navigate to the Rajya sabha section of the same page.

How to link a tele phone number?

We can link a tele phone number by using the below syntax.

Syntax

Following is the syntax to link a tele phone number.

<a href="tel: phone number">phone number</a>

By using tel: inside the href attribute, we can link to a phone number.

Example

Following is the example program to link a tele phone number to the web page.

<!DOCTYPE html> <html> <body> <p><a href="tel:9381276097">9381276097</a></p> </body> </html>

How to link to a mail address?

We can link to a mail address by using the below syntax.

Syntax

Following is the syntax to link a mail address to the web page.

<a href="mailto:xx@gmail.com">xx@gmail.com</a>

Same as the way we link a mobile number. We use mailto instead of tel inside a href attribute.

Example

Following is the example program to link a mail address to the web page.

<!DOCTYPE html> <html> <body> <p><a href="mailto:lokeshnayak@gmail.com">lokeshnayak@gmail.com</a></p> </body> </html>

When we click on the email address it will navigate us to the default mail app in our system.

Updated on: 11-Nov-2022

1K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements