In this post, we will learn how we can open a link in a new Tab or Window. When we link one web page to another web page and we want this other web page to open in a new Tab or Window. For this, we will use a special attribute.

How To Open a Link in a New Tab/Window in HTML ?

Open a Link in a New Tab/Window

We use the anchor element to link a web page to another web page. But when we click on such a link, this link opens that link in the current tab or window. For example, you can see the output of the code below.

<a href="google.com">Google</a> code-box

But we want our link to open in a new tab or window. For this we will use target attribute with <a> tag. This target attribute tells the browser how to open a link. When we set the target attribute to _blank , the browser will open the link in a new tab or window. For example, you can see the output of the code below.

<a href="google.com" target="_blank">Google</a> code-box

Whenever we use target = "_ blank", we must add rel = "noreferrer noopener" with anchor element. The rel attribute establishes a relationship between our page and the linked URL. This reduces the risk of phishing. 

In this way we will use the example below to open a link to another web page:

<a href="google.com" target="_blank" rel="noopener noreferrer">Google</a> code-box


Summary

In this post we learn how to open a link in a new tab/window in HTML. You try to make it yourself. I hope you make. If you face any problem, then comment and tell us. Keep visiting the blog to read more similar posts.

Post a Comment

Previous Post Next Post