Create An HTML Button That Acts Like A Link Using CSS

For More Videos Visit Our YouTube Channel

Create An HTML Button That Acts Like A Link - Why?




Here we consider how to create a Button that act like a Link. Why we need a button that behave like a link?. We can open the navigation URL on a new window without any pop up alert. Lets start with an example here.


Create An HTML Button That Acts Like A Link - Solution

Suppose we have a div with purple background color. Now introduce some link on inside this Div as shown below. All links have a common class named button.



For making this link as Button add following style on the Class button.

a.button
{
border: 1px solid white;
border-radius: 10px;
box-shadow: 0 0 34px pink inset;
color: white;
text-align: center;
text-decoration: none;
text-shadow: 0 1px 2px white;
text-transform: uppercase;
font: lighter 12px Helvetica,sans-serif;
transition: color 0.25s ease-in-out 0s;
margin: 0 auto;
padding: 7px 2%;
}


That's all, just run your application, you can see the result.