How to create an HTML button that acts like a link with CSS?

Spread the love

Sometimes, we want to create an HTML button that acts like a link with CSS.

In this article, we’ll look at how to create an HTML button that acts like a link with CSS.

How to create an HTML button that acts like a link with CSS?

To create an HTML button that acts like a link with CSS, we can set the appearance CSS property to button.

For instance, we write

<a href="https://example.com" class="button">example</a>

to add an a element.

Then we write

a.button {
  -webkit-appearance: button;
  -moz-appearance: button;
  appearance: button;

  text-decoration: none;
  color: initial;
}

to set the appearance CSS property to button to make the a element with class button look like a button.

We use text-decoration: none; to remove the text underline.

Conclusion

To create an HTML button that acts like a link with CSS, we can set the appearance CSS property to button.

Leave a Reply

Your email address will not be published.