Eliminar el estilo completo de un botón HTML/enviar

Resuelto Saif Bechan asked hace 14 años • 7 respuestas

¿Existe alguna forma de eliminar por completo el estilo de un botón en Internet Explorer? Utilizo un objeto CSS para mi botón y todo se ve bien.

Pero cuando hago clic en el botón, se mueve un poco hacia arriba, lo que hace que parezca fuera de forma. ¿Hay un estado de clic CSS o mousedown? No sé qué desencadena ese estado.

Sé que no es gran cosa, pero a veces son las pequeñas cosas las que importan.

Saif Bechan avatar Mar 17 '10 12:03 Saif Bechan
Aceptado

Creo que esto proporciona un enfoque más completo:

button, input[type="submit"], input[type="reset"] {
	background: none;
	color: inherit;
	border: none;
	padding: 0;
	font: inherit;
	cursor: pointer;
	outline: inherit;
}
<button>Example</button>
Expandir fragmento

Kevinleary.net avatar Aug 26 '2017 00:08 Kevinleary.net

Su pregunta dice "Internet Explorer", pero para aquellos interesados ​​en otros navegadores, ahora pueden usar all: unsetlos botones para quitarles el estilo.

No funciona en IE, pero es compatible con todos los demás.

https://caniuse.com/css-all

Advertencia de accesibilidad: por el bien de los usuarios que no utilizan el puntero del mouse, asegúrese de volver a agregar algo :focusde estilo, por ejemplo, button:focus { outline: orange auto 5px }para accesibilidad del teclado . Si te da pereza, puedes button:focus { outline: revert }revertir el esquema al valor predeterminado del navegador. https://caniuse.com/css-revert-value

(Y espero que esto sea evidente, pero asegúrese de agregar algún tipo de estilo para que su botón realmente parezca un botón, y preferiblemente algo :hoverde estilo también. Si su botón no tiene un borde, considere cursor: pointertambién. )

button {
  all: unset;
}

button:focus {
  outline: revert;
}
<button>check it out</button>
Expandir fragmento

Dan Fabulich avatar Jan 08 '2019 23:01 Dan Fabulich