He mirado por todas partes y no puedo resolver esto: ¿cómo apuntas al botón de enviar estado deshabilitado en css?¿Cómo se dirige el estado deshabilitado de un botón de envío?
Por ejemplo: ¿Cómo voy a apuntar y estilo en este botón:
<input value="Validate" disabled="disabled" type="submit"/>
que puede utilizar:
input[disabled=disabled][type=submit] {
background:green;
}
Funciona en Firefox y es supuestamente bueno en todos excepto IE6. Pero no he probado personalmente este tipo de selector combinado.
PS: Una más robusto, el método multi-navegador, usando jQuery ...
$("input[disabled=disabled][type=submit]").css
({
'background': 'yellow',
'color': 'blue'
});
input[disabled='disabled'][type='submit']
{
...
}
no funciona en IE 6, pero debería, en todos los demás navegadores. Reference
También está el :disabled pseudo-class pero eso no es compatible con IE en absoluto.
Diseñar elementos deshabilitados es difícil, ya que a veces tienen propiedades que no se pueden anular. Este artículo muestra qué estilos se aplican en qué navegadores: Styling disabled form controls with CSS
Espera, ¿este estilo no tiene todos los elementos desactivados? ¿Hay alguna manera de apuntar específicamente a los botones desactivados? _ – Thomas
@Thomas yup, lo hará. Debería ser posible combinar esto con '[type = 'submit']' pero no sé cómo ser honesto. Una clase funcionaría así: 'input.classname [disabled ....' –
@Thomas try '[type = 'submit'] [disabled = 'disabled']' no hay garantías, aunque –
No existe una pseudo clase definida en CSS para un estado deshabilitado.
Supongo que usar JQuery para cambiar la clase de CSS para los botones desactivados.
Códigopara jQuery:
<script language="javascript">
$('input[type=button]').each(function() {
if ($(this).attr('disabled') == true)
{
$(this).addClass('disabled');
}
});
</script>
Añadir un elemento de estilo 'discapacitados'.
Hay una pseudo-clase en CSS3 , pero no es compatible con IE. –
+1, como el soporte del navegador es muy desigual, ir por una ruta JS parece una buena solución, siempre y cuando esté seguro de que el cliente tiene javascript habilitado. – dmp
Estoy usando Jquery, ¿cómo implementaría esto? – Thomas
Una forma en que puedo pensar para esto es mediante la desactivación de la clase del botón y luego usando "input.disabled" para especificar el CSS apropiado. ¿Funcionaría eso en el contexto en que estás haciendo esto?
Pensé en eso, pero me preocupa que esto pueda ser visto como una mala codificación por parte del ingeniero ... Nunca sé lo que va a piratear a esos tipos. – Thomas
Estoy de acuerdo en que no es ... "agradable", pero es una solución bastante simple. Sin embargo, nunca he trabajado en un entorno de codificación profesional. ¡No sé lo que esperan! –
CSS3 agrega la pseudoclase :disabled, que hace exactamente lo que usted desea.
input:disabled {
/*Disabled styles for input elements here*/
}
Como this page muestra todos los principales navegadores (excepto IE8) apoyan esta etiqueta, por lo que parece inservible todavía (a menos que no necesita soporte IE)
Si tiene un jefe o cliente que no requiere soporte de IE, ¡por favor llámeme! ;-) Necesitaba semanas y montones de estadísticas para poder dejar IE6 e IE7. –
Jeje ... Bueno * tu * no * se las arregló para soltar IE6 e IE7, ¡ya ahorra muchos problemas! – Veger
"** Meta el estado desactivado ** botón de enviar". ¿Puedes ser mas específico? – rahul
Supongo que quiere saber cómo CSS un botón en gris. – NibblyPig
Sí, acabo de actualizar más arriba con un botón de ejemplo – Thomas