With CSS3, it’s super easy to take a boring, un-styled link, like this: 
and turn it into a beautiful, customized button, like this:
Join us in our newest publication:
All it takes is a little bit of styling. To start, you’re going to need some basic <a> tags. Remove the default link styling (the color and the underline), and add a background-color, some padding, and maybe even a border-radius. Here’s what the CSS might look like:
- a{
- text-decoration: none;
- color: #fff;
- background-color: #338d74;
- border-radius: 3px;
- padding: 5px 7px;
- font-family: 'Open Sans';
- }
Now your button probably looks like the one in the image above. To add a little more dimension to the element, give it a linear-gradient background.
- a{
- background: linear-gradient(#68b6a0, #338d74);
- }
Now that you have your finished product, try to customize it even more. Use animations, box-shadows, borders, and/or hover effects to really make it your own.