¿Cómo hacer que un botón de envío se muestre como un enlace?

Esto no está funcionando en IE:

.text-button { background: transparent; text-decoration: none; cursor: pointer; }  

Muestra un botón cuadrado.

Copiado desde este enlace , puede hacer que su botón se vea como un enlace:

 .submitLink { background-color: transparent; text-decoration: underline; border: none; color: blue; cursor: pointer; } submitLink:focus { outline: none; } 
  

Necesitaba preparar una página de redirección de publicaciones y dado que estas dependen del envío de formularios, necesitaba colocar algo en ellos para que funcionasen aunque el Javascript fallara por alguna razón. Si Javascript falla, entonces un ancla para enviar el formulario tampoco funcionará. Tuve que formatear realmente el botón para que pareciera un enlace (por lo que la página de redirección se parece a una). Basé mi solución en lo que Vishal escribió, pero hice algunas pequeñas modificaciones para que se vea mejor en línea. Aquí está el resultado.

 button { padding:0; background-color:transparent; text-decoration:underline; border:none; border:0; color:blue; cursor:pointer; font-family:inherit; font-size:inherit; } button::-moz-focus-inner { border:0; padding:0; } 
 To complete the redirect . 

Prueba esto:

   

IMO Supongo que soy un desarrollador difícil de tratar. Sugeriría a las personas que solicitan esta aplicación la opción de dejar que siga siendo un botón.

¿Han considerado ellos lo siguiente?

  1. ¿Es una buena práctica desde el punto de vista de UI usar algo que no sea un botón para enviar un formulario?
  2. Si vas con el enfoque de CSS, no creo que Safari te permita cambiar para ver un botón.
  3. Si usa la etiqueta con algunos javascript, entonces tiene un formulario sin un botón de envío, lo que puede causar dolores de cabeza en el futuro. ¿Cómo se detecta fácilmente el enlace de envío de sus otras tags ?

Creo que la respuesta presentada anteriormente por mofolo es la solución más correcta

El estilo CSS de los botones de envío para que se vean como tags de anclaje NO cruza el navegador. Varios tipos de navegadores ignoran el estilo text-decoration: underline.

El mejor método en mi experiencia es usar javascript en el evento onclick de una etiqueta ancla.

Por ejemplo:

Un enlace “Eliminar” en una pantalla de formulario de detalles del usuario, con confirmación antes de enviar el formulario con un id de “userdetails”

 Delete 

prueba esto:

 .text-button { border: none; background: transparent; cursor: pointer } 

No puede hacer eso con el botón, ya que elementos como los elementos de entrada son elementos del navegador y la máquina del cliente, no su código CSS.

Debe usar una etiqueta que enlace a un fragmento de JavaScript que luego envía el formulario por usted.