Show Output
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Make HTML Link Look Like a Button</title> <style> a.link-btn { color: #fff; background: #337ab7; display:inline-block; border: 1px solid #2e6da4; font: bold 14px Arial, sans-serif; text-decoration: none; border-radius: 2px; padding: 6px 20px; } a.link-btn:hover { background-color: #245582; border-color: #1a3e5b; } </style> </head> <body> <a href="https://google.com" class="link-btn">Go to Google</a> <p><strong>Note:</strong> Open the output of this example in a blank tab (click the arrow next to "Show Output" button) and then click the "Go to Google" button.</p> </body> </html>
