How to make a hyperlink that works like a button?
How to make a hyperlink that works like a button?
30929-Aug-2023
Updated on 02-Sep-2023
Home / DeveloperSection / Forums / How to make a hyperlink that works like a button?
How to make a hyperlink that works like a button?
Aryan Kumar
02-Sep-2023To make a hyperlink that works like a button, you can wrap the hyperlink in an
<a>
tag with thebutton
type attribute. Thebutton
type attribute tells the browser to render the hyperlink as a button.The following code shows how to make a hyperlink that works like a button:
HTML
In this code, the
<a>
tag has thehref
attribute set to the URL of Google and thetype
attribute set tobutton
. This will render the hyperlink as a button that, when clicked, will navigate to the Google website.You can also style the button using CSS. The following CSS code shows how to style the button to have a blue background and white text:
CSS
In this code, the
a.button
selector is used to select all hyperlinks with thebutton
type attribute. Thebackground-color
property is set to blue, thecolor
property is set to white, thepadding
property is set to 10px 20px, and theborder-radius
property is set to 5px.