You are currently viewing How to Add Link to Button in HTML | Step by Step Guide
  • Post category:HTML

How to Add Link to Button in HTML | Step by Step Guide

Add Link to Button HTML

In this article, I am going to tell you how to add a link to a button in HTML. We can add a link to a button in two ways, Let’s see what those two ways are:

Method 1 : using anchor inside button

  1. Create an <a> tag and place the <button> tag inside it
  2. Then Using the “href” attribute of the <a> tag, we can give the link to the webpage we want to link.
  3. If we do this, when we click the button, the link given in the “href” attribute will open. See the above code for an example.

Code:

<html>
<head>
  <title>Button link</title>
</head>
<body>
  <a href="https://wonderdevelop.com"><button class="b1">Button 1</button></a>
</body>
</html>

Method 2: using onclick attribute

  1. Create <button> and use “onclick” attribute to the <button> tag.
  2. Inside the double quotes of “onclick” attribute, we should use “window.location.href” function.
  3. Then you should give your webpage link inside the single quotes as in the above code.

Code:

<html>
<head>
   <title>Button link</title>
</head>
<body>
  <button onclick="window.location.href='https://wonderdevelop.com' ">Button 1</button>
</body>
</html>

 

Leave a Reply