Vision du web. La réponse collaborative.

Gagner des Bitcoins.

Le HackerSpace Vision du web.
La réponse collaborative.
Le glider des Hackers.
Un symbole de rassemblement.
QWERTY.
Du clavier au terminal.
GNU / Linux Debian.
La distribution universelle.
GNU / Linux Ubuntu.
Linux pour les êtres humains.
GNU / Linux Arch.
Un Linux léger et flexible.
Nom de code Linux.
Documentaire FR.

Vous n´êtes pas identifié(e).

Nous sommes le lundi 19 novembre 2018. Il est .

Nous avons 488 invités et aucun membre en ligne

 
HackerSpace !
× Accessibilité web et normes W3C et WCAG.

Les éléments d'un formulaire HTML

  • VisionDuWeb
  • Portrait de VisionDuWeb Auteur du sujet
  • Hors Ligne
  • Modérateur
  • Modérateur
  • Animateur.
Plus d'informations
il y a 3 ans 6 mois #581 par VisionDuWeb
VisionDuWeb a créé le sujet : Les éléments d'un formulaire HTML
<form> et ses attributs
name Nom du formulaire
action Adresse du script de serveur à exécuter
method Méthode d'appel du script (get ou post)
enctype Type d'encodage du formulaire
target Destination du retour du formulaire


<input></input> et ses attributs
Cette liste est générique, des particularités surviennent suivant le type choisit.
name Nom du champ
type Type du champ text, button, radio, checkbox, hidden, password, submit, reset
value Libellé texte
defaultvalue Valeur par défaut du champ (utile avec reset)
size Taille du champ
maxlength Taille maximale du champ de type texte
checked Case à cocher ou radio bouton coché ou non
disabled Grisé (modification impossible par le visiteur)
readOnly Lecture seule
class Nom de la classe de style
style Chaîne de caractères pour le style

<input type="text">
Propriétés acceptées : name | value | defaultvalue | size | maxlength | disabled, readOnly, class, style

<input type="button" value="Ceci est un bouton">
Propriétés acceptées : name | value | defaultvalue | size | maxlength | disabled | readOnly | class | style

<input type="radio" name="sexe" value="homme" checked>Homme -
<input type="radio" name="sexe" value="femme">Femme
Pour définir un groupe, il faut donner le même nom à tous les champs, la sélection sera unique pour l'ensemble du groupe.
Propriétés acceptées : name | value | checked | disabled | readOnly | class | style

<input type="checkbox" name="majeur" checked>Majeur
<input type="checkbox" name="etudiant">Etudiant
Possibilité de choix multiples.
Propriétés acceptées : name | checked | disabled | readOnly | class | style

<input type="password" name="passe" value="azerty" size=10>
Password se présente comme un champ texte mais affiche des * pour cacher le contenu du champ, il possède les mêmes propriétés que le champ texte.
Il est impossible de copier le contenu (CTRL+C). Il est donc adapté à la saisie de mot de passe.

<input type="hidden" value="Contenu caché" name="pouff">
Un champ caché est destiné à transmettre des informations dans le formulaire sans que le visiteur ne s'en aperçoivent.
Cela peut être une adresse mail, un résultat de traitement, l'heure, un cookie ou toute autre information.
Propriétés acceptées : name | value | defaultvalue

<input type="reset" value="RESET">
<input type="submit" value="SUBMIT">
Eventuellement à éviter ?


La balise <select> pour les listes
Les lignes de contenu sont alimentées par la balises <option>

<select name="mono" size=1>
<option value="1">ligne 1</option>
<option value="2">ligne 2</option>
<option value="3">ligne 3</option>
<option value="4">ligne 4</option>
</select>

Les listes peuvent se présenter de plusieurs manières selon leur propriété :
Fichier(s) joint(s):
[L’extension jpg a été désactivée et ne peut plus être affichée.]

Les attributs de la balise <select>
name Nom de la liste
size Nombre de lignes à afficher
multiple Sélection multiple autorisée
disabled Grisage de la liste
class Classe de feuille de style
style Style de la liste

Les attributs de la balise <option> : name, value, selected.
Selected force la sélection de cette occurence dans la liste.


La balise <textarea> pour la zone de texte multi-lignes
Essentiellement utilisé pour permettre aux visiteurs de saisir un texte long (message, descriptif, ...)

<textarea name="texte" rows="5" cols="20">Ligne 1
Ligne 2
Ligne 3
</textarea>
Le texte dans le code source apparaît tel quel.

<textarea> et ses attributs :
name Nom de la zone
rows Nombre de lignes
cols Nombre de colonnes
disabled Grisage de la zone
readOnly Lecture seule
class Classe de feuille de style
style Style de la liste


Ajouter les Checkbox / Bouton radio

Complément sur l'accessibilité : www.aliasdmc.fr/wai/accessibilite132.html

Vision du web. La réponse collaborative.

Connexion ou Créer un compte pour participer à la conversation.

  • Zer00CooL
  • Portrait de Zer00CooL
  • Hors Ligne
  • Modérateur
  • Modérateur
  • Le zéro, ce "rien qui peut tout".
Plus d'informations
il y a 1 an 4 mois - il y a 5 mois 3 semaines #2393 par Zer00CooL
Zer00CooL a répondu au sujet : Donner du style aux listes déroulantes
Donner du style aux listes déroulantes

Donner du style aux listes déroulantes : red-team-design.developpez.com/tutoriels/css/donner-style-listes-deroulantes/

Contre le camp de la majorité silencieuse, j'ai choisi la minorité bavarde.
L'urgent est fait, l'impossible est en cours, pour les miracles prévoir un délai.
Dernière édition: il y a 5 mois 3 semaines par Zer00CooL.
Les utilisateur(s) suivant ont remercié: VisionDuWeb

Connexion ou Créer un compte pour participer à la conversation.

  • VisionDuWeb
  • Portrait de VisionDuWeb Auteur du sujet
  • Hors Ligne
  • Modérateur
  • Modérateur
  • Animateur.
Plus d'informations
il y a 1 semaine 4 jours #3318 par VisionDuWeb
VisionDuWeb a répondu au sujet : 101 ways to (ab)use a checkbox
101 ways to (ab)use a checkbox
Par Ryan Seddon.

Source : www.thecssninja.com/talks/abuse_checkboxes/#/

Vision du web. La réponse collaborative.

Connexion ou Créer un compte pour participer à la conversation.

REMARQUE ! Ce site utilise des cookies et autres technologies similaires.

Si vous ne changez pas les paramètres de votre navigateur, vous êtes d'accord. En savoir plus

J'ai compris

En poursuivant votre navigation sur ce site, vous acceptez l’utilisation de Cookies pour vous proposer un accès membre personnalisé et réaliser des statistiques de visites.

Vision du web sur votre réseau social