css - style - selector input type jquery
Selector CSS para<input type="?" (4)
Lo siento, la respuesta corta es no. CSS (2.1) solo marcará los elementos de un DOM, no sus atributos. Tendría que aplicar una clase específica a cada entrada.
Bummer lo sé, porque sería increíblemente útil.
Sé que has dicho que prefieres CSS sobre JavaScript, pero aún debes considerar usar jQuery. Proporciona una forma muy limpia y elegante de agregar estilos a los elementos DOM en función de los atributos.
¿Hay alguna manera con CSS para apuntar todas las entradas según su tipo? Tengo una clase deshabilitada que uso en varios elementos de formulario deshabilitados, y estoy configurando el color de fondo para cuadros de texto, pero no quiero que mis casillas obtengan ese color.
Sé que puedo hacer esto con clases separadas, pero prefiero usar CSS si es posible. Estoy seguro de que puedo configurar esto en javascript, pero de nuevo en busca de CSS.
Me estoy enfocando en IE7 +. Entonces no creo que pueda usar CSS3.
Editar
Con CSS3, ¿podría hacer algo así?
INPUT[type=''text'']:disabled que sería aún mejor deshacerse de mi clase por completo ...
Editar
¡De acuerdo, gracias por la ayuda! Así que aquí hay un selector que modifica todos los cuadros de texto y las áreas que se han deshabilitado sin necesidad de configurar ninguna clase, cuando comencé esta pregunta nunca pensé que esto fuera posible ...
INPUT[disabled][type=''text''], TEXTAREA[disabled]
{
background-color: Silver;
}
Esto funciona en IE7
Puedes hacer esto con jQuery. Usando sus selectores, puede seleccionar por atributos, como tipo. Sin embargo, esto requiere que sus usuarios tengan Javascript activado y un archivo adicional para descargar, pero si funciona ...
Sí. IE7 + admite selectores de atributos:
input[type=radio]
input[type^=ra]
input[type*=d]
input[type$=io]
Elemento de entrada con tipo de atributo que contiene un valor que es igual a, comienza con, contiene o termina con un cierto valor.
Otros selectores seguros (IE7 +) son:
- Padre> hijo que tiene:
p > span { font-weight: bold; }p > span { font-weight: bold; } - Precedido por ~ elemento que es:
span ~ span { color: blue; }span ~ span { color: blue; }
Lo cual para <p><span/><span/></p> le daría efectivamente:
<p>
<span style="font-weight: bold;">
<span style="font-weight: bold; color: blue;">
</p>
Lectura adicional: compatibilidad con CSS del navegador en quirksmode.com
Me sorprende que todos los demás piensen que no se puede hacer. Los selectores de atributos CSS ya han estado aquí por algún tiempo. Supongo que es hora de que limpiemos nuestros archivos .css.
Lamentablemente, los otros carteles son correctos de que eres ... en realidad corregido por kRON, estás bien con tu IE7 y un documento estricto, pero la mayoría de nosotros con requisitos IE6 se reducen a JS o referencias de clase para esto, pero es una propiedad CSS2, solo una sin soporte suficiente de navegadores IE ^ h ^ h.
Fuera de compleción, el selector de tipo es similar a xpath de la forma [attribute=value] pero existen muchas variantes interesantes. Será bastante poderoso cuando esté disponible, es bueno tenerlo en mente para IE8.