Un pequeño tip de cómo cambiar la apariencia de un bóton Submit por un enlace ó Link haciendo uso de CSS.
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Button Link demo</title>
<meta name="author" content="Natalie Downe">
<!-- Date: 2009-06-08 -->
<style type="text/css">
body {
font-family: "Verdana" sans-serif;
}
a:link,
a:visited {
color: blue;
}
a:hover,
a:focus,
a:active {
color: black;
}
button {
overflow: visible;
width: auto;
}
button.link {
font-family: "Verdana" sans-serif;
font-size: 1em;
text-align: left;
color: blue;
background: none;
margin: 0;
padding: 0;
border: none;
cursor: pointer;
-moz-user-select: text;
/* override all your button styles here if there are any others */
}
button.link span {
text-decoration: underline;
}
button.link:hover span,
button.link:focus span {
color: black;
}
</style>
</head>
<body>
<form action="#" method="post">
<p><button type="submit" class="link"><span>Hello there I am a button</span></button></p>
</form>
<p><a href="#">Well thats nice, I am a link</a></p>
</body>
</html>
El resultado lo puedes ver aquí. A simple vista no hay diferencia, ambos textos parecen links pero el primero es un botón.
Vía Ajaxian