llamar - selectores avanzados css

Selector de CSS para que coincida con un elemento sin atributo x

Question

Estoy trabajando en un archivo CSS y encuentro la necesidad de diseñar cuadros de entrada de texto, sin embargo, estoy teniendo problemas. Necesito una declaración simple que coincida con todos estos elementos:

<input />
<input type=''text'' />
<input type=''password'' />

... pero no coincide con estos:

<input type=''submit'' />
<input type=''button'' />
<input type=''image'' />
<input type=''file'' />
<input type=''checkbox'' />
<input type=''radio'' />
<input type=''reset'' />

Esto es lo que me gustaría hacer:

input[!type], input[type=''text''], input[type=''password''] {
/* styles here */
}

En el CSS anterior, observe que el primer selector se input[!type] . Lo que quiero decir con esto es que quiero seleccionar todos los cuadros de entrada donde no se especifica el atributo de tipo (porque el valor predeterminado es texto pero la input[type=''text''] no coincide). Desafortunadamente, no hay tal selector en la especificación CSS3 que pude encontrar.

¿Alguien sabe de una manera de lograr esto?

Answer 1

Para una solución más multiplataforma, puede aplicar un estilo a todas las entradas de la forma que desee, el texto y la contraseña sin escribir, y luego otro estilo que anule ese estilo para radios, casillas de verificación, etc.

input { border:solid 1px red; }
input[type=radio],
input[type=checkbox],
input[type=submit],
input[type=reset],
input[type=file]
{ border:none; }

- o -

¿Podría cualquier parte de su código que genere las entradas no escritas darles una clase como .no-type o simplemente no dar salida? Adicionalmente este tipo de selección se podría hacer con jQuery.

Answer 2

Solo quería agregar a esto, puede tener el selector: not en oldIE utilizando selectivizr: http://selectivizr.com/

Answer 3

: no selector

input:not([type]), input[type=''text''], input[type=''password''] {
/* style here */
}

Support: en Internet Explorer 9 y superior