Champ de saisie CSS couleur du texte saisi
J'ai un champ de saisie, et la couleur du texte est noir. (Je suis en utilisant jquery.placeholder) disons que le texte est "E-Mail"
Lorsque vous cliquez sur ce champ, le texte d'espace réservé noir disparaît (grâce à jquery.réservé).
Tout texte entré dans ce champ, je veux qu'il devienne rouge, et quand vous désélectionnez ce champ, je veux qu'il reste rouge.
Pour le moment, le texte disant "E-Mail" est noir, et tout ce que je tape est Rouge, ce qui est génial, mais dès que je désélectionne, il retourne au noir. Quelqu'un peut-il m'aider? Je veux que le texte reste rouge, même après qu'il soit désélectionné. Voici mon code
textarea:focus, input:focus {
color: #ff0000;
}
input, select, textarea{
color: #000;
}
4 réponses
Changez votre deuxième style pour ceci:
input, select, textarea{
color: #ff0000;
}
Pour le moment, vous demandez au formulaire de changer le texte en black Une fois que le focus est désactivé. Les remèdes ci-dessus que.
En outre, c'est une bonne idée de placer les styles d'état normaux avant les styles :focus et :hover dans votre feuille de style. Cela aide à prévenir ce problème. Donc
input, select, textarea{
color: #ff0000;
}
textarea:focus, input:focus {
color: #ff0000;
}
Je fais toujours des invites d'entrée, comme ceci:
<input style="color: #C0C0C0;" value="someone@somewhere.com"
onfocus="this.value=''; this.style.color='#000000'">
Bien sûr, si votre utilisateur remplit le champ, change de focus et revient au champ, le champ sera à nouveau effacé. Si vous le faites comme ça, assurez-vous que ce que vous voulez. Vous pouvez en faire une chose unique en définissant un sémaphore, comme ceci:
<script language = "text/Javascript">
cleared[0] = cleared[1] = cleared[2] = 0; //set a cleared flag for each field
function clearField(t){ //declaring the array outside of the
if(! cleared[t.id]){ // function makes it static and global
cleared[t.id] = 1; // you could use true and false, but that's more typing
t.value=''; // with more chance of typos
t.style.color='#000000';
}
}
</script>
Votre champ ressemble alors à ceci:
<input id = 0; style="color: #C0C0C0;" value="someone@somewhere.com"
onfocus=clearField(this)>
Remplacer:
input, select, textarea{
color: #000;
}
Avec:
input, select, textarea{
color: #f00;
}
Ou color: #ff0000;
Pour ajouter de la couleur à une entrée, Utilisez le code css suivant:
input{
color: black;
}