web:html:formulaires

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentes Révision précédente
Prochaine révision
Révision précédente
web:html:formulaires [2023/03/28 14:53] – [Input] jcheronweb:html:formulaires [2023/03/28 17:52] (Version actuelle) – [Input] jcheron
Ligne 21: Ligne 21:
   * **action** permet de spécifier la ressource côté serveur qui recevra la requête et effectuera son traitement.   * **action** permet de spécifier la ressource côté serveur qui recevra la requête et effectuera son traitement.
  
 +===== Label =====
 +Les **labels** sont les étiquettes donnant une indication textuelle sur un champ, et permettant d'y accéder (par un click) :
 +
 +<html>
 +<table border=0 width="100%">
 +<tr><td></html>
 + <sxh html;gutter:false>
 +<label for="nom">Votre nom :</label>
 +<input type="text" id="nom" placeholder="Entrez votre nom">
 +</sxh>
 +<html></td><td><label for="nom">Votre nom :</label>
 +<input type="text" id="nom" placeholder="Entrez votre nom"></td></tr></table></html>
 +
 +<wrap info>L'attribut **for** du label doit correspondre à l'**id** du champ relatif.</wrap>
 +
 +===== Fieldset =====
 +Les **fieldsets** permettent de regrouper visuellement un ensemble de champs dans une zone, la balise **legend** lui attribue un titre :
 +
 +<html>
 +<table border=0 width="100%">
 +<tr><td></html>
 + <sxh html;gutter:false>
 +<fieldset>
 +    <legend>Connexion</legend>
 +    <label for="login">Login :</label>
 +    <input type="text" id="login" placeholder="Entrez votre login">
 +    <label for="pwd">Mot de passe :</label>
 +    <input type="password" id="pwd" placeholder="Entrez votre mot de passe">
 +</fieldset>
 +</sxh>
 +<html></td><td><fieldset>
 +<legend>Connexion</legend>
 +<label for="login">Login :</label>
 +<input type="text" id="login" placeholder="Entrez votre login">
 +<label for="pwd">Mot de passe :</label>
 +<input type="password" id="pwd" placeholder="Entrez votre mot de passe">
 +</fieldset></td></tr></table></html>
 ===== Champs ===== ===== Champs =====
 ==== Input ==== ==== Input ====
-Ce sont les champs de saisie, dont le plus commun est le champ de type texte :+Ce sont les champs de saisie, dont le plus commun est le champ de type **text** :
  
 === Propriétés communes === === Propriétés communes ===
Ligne 146: Ligne 183:
   <option>Poire</option>   <option>Poire</option>
 </datalist></html> | </datalist></html> |
-^Jauge| <sxh html;gutter:false><progress max="100" value="75">75/100</progress></sxh> | <html><progress max="100" value="75">75/100</progress></html> |+^Progressbar | <sxh html;gutter:false><progress max="100" value="75">75/100</progress></sxh> | <html><progress max="100" value="75">75/100</progress></html>
 +^Jauge | <sxh html;gutter:false><meter min="0" max="100" value="75" low="33" high="66" optimum="50">75</meter></sxh> | <html><meter min="0" max="100" value="75" low="33" high="66" optimum="50">75</meter></html> |
  
  
 +<button>[[web:html:formulaires:pseudoclass|]]</button>
  
  • web/html/formulaires.1680008011.txt.gz
  • Dernière modification : il y a 2 ans
  • de jcheron