Bonjour,
je démarre les formulaires HTML5 et leur mise en page via CSS3
J'aimerais indiquer au niveau d'une balise "label" que son input associé est ou non obligatoire (en fonction de l'attribut required)
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20 <fieldset> <legend>Informations personnelles</legend> <ol> <li> <label class="pour_formulaires" for="id_03">Prénom</label> <input type="text" autofocus="autofocus" required="required" placeholder="Prénom" name="name_03" id="id_03" form="formulaire_xsoftware"/> </li> <li> <label class="pour_formulaires" for="id_04">Nom</label> <input type="text" placeholder="Nom de famille" name="name_04" id="id_04" form="formulaire_xsoftware"/> </li> <label class="pour_formulaires" for="id_05">Email</label> <input type="email" required="required" placeholder="nom.prénom@domaine.fr" name="name_05" id="id_05" form="formulaire_xsoftware"/> </li> <li> <label class="pour_formulaires" for="id_06">Téléphone</label> <input type="tel" required="required" placeholder="Eg. +33412345678" name="name_06" id="id_06" form="formulaire_xsoftware"/> </li> </ol> </fieldset>
Je ne souhaite pas le faire au niveau de l'input car j'ai déjà le style suivant
qui affiche un feurouge si le champs est incorrectement rempli.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3 form#formulaire_xsoftware input:invalid { background: url(img/feurouge.png) no-repeat 98% center; }
Autre raison pour laquelle je souhaite mettre dans le label :
Je n'arrive pas à distinguer mes balises select, alors que cela fonctionne pour les input
D'avance, merci pour vos suggestions
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4 form#formulaire_xsoftware input[required], form#formulaire_xsoftware select[required] { background: #FFE000; /* espèce de jaune*/ }
Partager