html - testo - width input text css




Selettore CSS per campi di input di testo? (6)

È possibile utilizzare :text selettore di :text per selezionare tutti gli input con testo tipo

Fiddle che lavora

$(document).ready(function () {
    $(":text").css({    //or $("input:text")
        'background': 'green',
        'color':'#fff'
    });
});

:text è un'estensione jQuery e non fa parte delle specifiche CSS, le query utilizzano: il testo non può trarre vantaggio dall'aumento delle prestazioni fornito dal metodo nativo DOM querySelectorAll (). Per prestazioni migliori nei browser moderni, usa invece [type="text"] . Questo funzionerà per IE6+ .

$("[type=text]").css({  // or $("input[type=text]")
    'background': 'green',
    'color':'#fff'
});

CSS

[type=text] // or input[type=text] 
{
    background: green;
}

Come posso indirizzare campi di input di tipo "testo" usando selettori CSS?


Come @Amir pubblicato sopra, il modo migliore oggi - cross-browser e lasciandosi alle spalle IE6 - è quello di utilizzare

[type=text] {}

Nessuno ha menzionato la specificità dei CSS ( why is that important ?) Finora, [type=text] features 0,0,1,0 invece di 0,0,1,1 con input[type=text] .

Per quanto riguarda le prestazioni, non c'è più alcun impatto negativo.

normalizza v4.0.0 appena rilasciato con specificità del selettore abbassato .


Di solito uso i selettori nel mio foglio di stile principale, quindi creo un file .js (jquery) specifico per ie6 che aggiunge una classe a tutti i tipi di input. Esempio:

$(document).ready(function(){
  $("input[type='text']").addClass('text');
)};

E poi basta duplicare i miei stili nello specifico foglio di stile ie6 usando le classi. In questo modo il markup effettivo è un po 'più pulito.


Ho avuto il campo di testo del tipo di input in un campo di riga della tabella. Lo sto prendendo di mira con il codice

.admin_table input[type=text]:focus
{
    background-color: #FEE5AC;
}

Puoi usare il selettore degli attributi qui:

input[type="text"] {
    font-family: Arial, sans-serif;
}

Questo è supportato in IE7 e versioni successive. È possibile utilizzare IE7.js per aggiungere supporto per questo se è necessario supportare IE6.

Vedi: http://reference.sitepoint.com/css/attributeselector per ulteriori informazioni


input [type = text]

Questo selezionerà tutto il testo del tipo di input in una pagina web.





html-input