Couleur zone de texte
Vlad51
-
avion-f16 Messages postés 19255 Date d'inscription Statut Contributeur Dernière intervention -
avion-f16 Messages postés 19255 Date d'inscription Statut Contributeur Dernière intervention -
Bonjour,
Je suis en train de faire un formulaire, dans les zones de texte j'ai mis un texte gris clair qui s'efface automatiquement lorsque l'on clique sur la zone de texte, le problème c'est que quand on rentre des données dans cette zone de texte cela écrit aussi en gris clair et j'aimerais qu'il s'affiche en noir. Si quelqu'un peut m'aider ?
merci
Voici la page en elle même :
Et là le css :
Je suis en train de faire un formulaire, dans les zones de texte j'ai mis un texte gris clair qui s'efface automatiquement lorsque l'on clique sur la zone de texte, le problème c'est que quand on rentre des données dans cette zone de texte cela écrit aussi en gris clair et j'aimerais qu'il s'affiche en noir. Si quelqu'un peut m'aider ?
merci
Voici la page en elle même :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Formulaire de contact</title>
<link href="Style contactez moi.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<h2>Contactez moi</h2>
<form name="Formulaire" action="mailto:#" method="post" enctype="text/plain">
Nom : <input type="text" name="nom" value="Entrez votre nom" class="transp" onfocus="javascript:this.value=''"
onblur="if(this.value=='')this.value='Entrez votre nom'" maxlength="20" /> <br />
Objet : <input type="text" name="objet" value="Entrez un titre" class="transp" onfocus="javascript:this.value=''"
onblur="if(this.value=='')this.value='Entrez le titre'" maxlength="20"/> <br />
<textarea name="projet" rows="8" cols="55" class="transp" onfocus="javascript:this.value=''" onblur="if(this.value=='')this.value='Tapez votre texte ici'">
Tapez votre texte ici
</textarea> <br />
<input type="reset" name="effacer" value="effacer" />
<input type="submit" name="envoyer" value="valider et envoyer"/>
</form>
</body>
</html>
Et là le css :
body
{
background-color: #FFF48D; /*couleur beurre frais sur wiki*/
}
.transp
{
color: #c0c0c0;
}
A voir également:
- Couleur zone de texte
- Excel cellule couleur si condition texte - Guide
- Alternative zone telechargement - Accueil - Outils
- Boite a couleur - Télécharger - Divers Photo & Graphisme
- Transcription audio en texte word gratuit - Guide
- Word couleur de fond texte - Guide
4 réponses
Salut.
Le plus simple est de faire ça avec deux classes CSS.
Pour pour le texte par défaut (en gris) et une autre pour le contenu (en noir).
Par exemple : .valeur_par_defaut et .valeur_modifiee
Le plus simple est de faire ça avec deux classes CSS.
Pour pour le texte par défaut (en gris) et une autre pour le contenu (en noir).
Par exemple : .valeur_par_defaut et .valeur_modifiee
<style type="text/css">
.valeur_par_defaut {
color: grey;
font-style: italic;
}
.valeur_modifiee {
color: black;
font-style: normal;
}</style>
<input type="text" name="nom" value="Votre nom" class="valeur_par_defaut"
onfocus="if(this.value == this.defaultValue) { this.value = ''; this.className = 'valeur_modifee'; }"
onblur="if(this.value == '') { this.value = this.defaultValue; this.className = 'valeur_par_defaut'; }"
/>
Salut,
Peut etre ça dans ton css, mais ça modifiera aussi les boutons.
Peut etre ça dans ton css, mais ça modifiera aussi les boutons.
textarea,input{
color:black;
}
Enchanté,
Essaye avec ce code :
<form name="Formulaire" action="mailto:#" method="post" enctype="text/plain">
Nom : <input type="text" name="nom" value="Entrez votre nom" class="transp" onfocus="javascript:this.value=''"
onblur="if(this.value=='')this.value='Entrez votre nom'" maxlength="20" /> <br />
Objet : <input type="text" name="objet" value="Entrez un titre" class="transp" onfocus="javascript:this.value=''"
onblur="if(this.value=='')this.value='Entrez le titre'" maxlength="20"/> <br />
<textarea name="projet" rows="8" cols="55" class="transp" onfocus="javascript:this.value=''" onblur="if(this.value=='')this.value='<span class="trans">Tapez votre texte ici</span>'">
Tapez votre texte ici
</textarea> <br />
<input type="reset" name="effacer" value="effacer" />
<input type="submit" name="envoyer" value="valider et envoyer"/>
</form>
Il va peut etre y avoir un probleme avec les cotes, mais je pense que l'idée est la.
Il faut appliquer la classe "trans" seulement a la phrase que tu veut afficher en gris, et non pas a la balise input.
Is it OK ?
Essaye avec ce code :
<form name="Formulaire" action="mailto:#" method="post" enctype="text/plain">
Nom : <input type="text" name="nom" value="Entrez votre nom" class="transp" onfocus="javascript:this.value=''"
onblur="if(this.value=='')this.value='Entrez votre nom'" maxlength="20" /> <br />
Objet : <input type="text" name="objet" value="Entrez un titre" class="transp" onfocus="javascript:this.value=''"
onblur="if(this.value=='')this.value='Entrez le titre'" maxlength="20"/> <br />
<textarea name="projet" rows="8" cols="55" class="transp" onfocus="javascript:this.value=''" onblur="if(this.value=='')this.value='<span class="trans">Tapez votre texte ici</span>'">
Tapez votre texte ici
</textarea> <br />
<input type="reset" name="effacer" value="effacer" />
<input type="submit" name="envoyer" value="valider et envoyer"/>
</form>
Il va peut etre y avoir un probleme avec les cotes, mais je pense que l'idée est la.
Il faut appliquer la classe "trans" seulement a la phrase que tu veut afficher en gris, et non pas a la balise input.
Is it OK ?
