Today, We want to share with you how to link one page to another page in html using button.In this post we will show you a href submit form onclick, hear for html submit button to static page we will give you demo and example for implement.In this post, we will learn about how to make a button link to another page in html? with an example.

How to Link Submit Button to Another Page in HTML?

Contents

HTML Links – The target Attribute

_self – Default. Opens the document in
the same window/tab as it was clicked
_blank – Opens the document in a new window or tab
_parent – Opens the document in the parent frame
_top – Opens the document in the full body of the window

button click move to next page in html

<button 
  onclick="document.location='index.php'">Website Learn Example</button>

a href to other site

<a href="https://www.pakainfo.com" target="_blank" rel="noopener noreferrer">
  Example Link
</a>

button as href

<button onclick="location.href='https://www.4cgandhi.com'" type="button">
         www.4cgandhi.com</button>

button with href

onClick={() => {window.location.href="https://www.4cgandhi.com/"}}

add link behind a button in html

<!DOCTYPE html>
<html>
   <head>
      <title>Title of the 4cgandhi</title>
   </head>
   <body>
      <form>
         <input type="button" onclick="window.location.href = 'https://www.4cgandhi.com';" value="4cgandhi"/>
      </form>
   </body>
</html>

button href

<a href="https://www.4cgandhi.com" class="btn btn-primary">Go to 4cgandhi</a>

Absolute URLs vs. Relative URLs

<!DOCTYPE html>
<html>
<body>

<h2>Absolute URLs</h2>
<p><a href="https://www.pakainfo.com/">pakainfo</a></p>
<p><a href="https://www.4cgandhi.com/">4cgandhi</a></p>

<h2>Relative URLs</h2>
<p><a href="tamil_rokers.asp">TamilRokers Movies Poster</a></p>
<p><a href="/hindi/index.asp">Hindi Movie List</a></p>

</body>
</html>

HTML Links – Use an Image as a Link

<!DOCTYPE html>
<html>
<body>

<a href="welcome.asp"><img src="tamilrokers.gif" alt="Free Download Movies for tamilrokers" style="width:52px;height:52px;"></a>

</body>
</html>

Link to an Email Address

<!DOCTYPE html>
<html>
<body>

<p><a href="mailto:[email protected]">Send email</a></p>

</body>
</html>

Button as a Link

<!DOCTYPE html>
<html>
<body>

<button onclick="document.location='welcome.asp'">TamilRokers Movies</button>
</body>
</html>

Link Titles

<!DOCTYPE html>
<html lang="en-US">
<body>

<h2>Link Titles</h2>
<p>The main title attribute eachs extra details about an element. The details is most often shown as a tooltip text when the mouse moves over the element.</p>
<a href="https://www.4cgandhi.com/tamilrokers/" title="Go to 4cgandhi Tamilrokers new link">Visit our Tamilrokers new link</a>

</body>
</html>

Style the link as a button

Example of styling a link as a button with CSS

<!DOCTYPE html>
<html>
  <head>
    <title>4cgandhi -  free download source code</title>
    <style>
      .button {
        background-color: #3d3d3d;
        border: none;
        color: white;
        padding: 20px 34px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 20px;
        margin: 4px 2px;
        cursor: pointer;
      }
    </style>
  </head>
  <body>
    <a href="https://www.4cgandhi.com/" class="button">4cgandhi - Click Here</a>
  </body>
</html>

I hope you get an idea about how to make a button link to another page in html.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.