How do I make an html link look like a button?

Question

I\'m using ASP.NET, some of my buttons just do redirects. I\'d rather they were ordinary links, but I don\'t want my users to notice much difference in the appearance. I c

Answer 1

How about using asp:LinkButton?

Answer 2

By using border, color and background color properties you can create a button lookalike html link!

a {
background-color: white;
color: black;
padding: 5px;
text-decoration: none;
border: 1px solid black;
}
a:hover {
background-color: black;
color: white;

}

<a href="https://stackoverflow.com/

">Open StackOverflow</a>

Hope this helps :]

Answer 3

I use an asp:Button:

<asp:Button runat="server"
            OnClientClick="return location='targetPage', true;"
            UseSubmitBehavior="False"
            Text="Button Text Here"
/>

This way, the operation of the button is completely client-side and the button acts just like a link to the targetPage.

Answer 4

If you need some cool effect, hover and shadow; you can use this:

    .button {
        text-decoration: none;
        padding: 15px 25px;
        font-size: 24px;
        cursor: pointer;
        text-align: center;
        text-decoration: none;
        outline: none;
        color: #fff;
        background-color: #450775;
        border: none;
        border-radius: 15px;
        box-shadow: 0 9px #e1d5ed;

    }

    .button:hover {background-color: #220440}

    .button:active {
        background-color: #230545;
        box-shadow: 0 5px #e1d5ed;
        transform: translateY(4px);
    }

Answer 5

a {
    display: block;
    height: 20px;
    width: auto;
    border: 1px solid #000;
}

You can play with <a> tags like this if you give them a block display. You can adjust the border to give a shade like effect and the background color for that button feel :)

Answer 6

You could create a standard button, then use it as the background image for a link. Then you can set the text in the link without changing the image.

The best solutions if you don't a special rendered button are the two already given by TStamper and Ólafur Waage.