Attribut HTML universel : autocapitalize
Limited availability
Cette fonctionnalité n'est pas Compatible car elle ne fonctionne pas dans certains des navigateurs les plus utilisés.
L'attribut universel autocapitalize est un attribut énuméré qui contrôle si le texte saisi est automatiquement mis en majuscule et, le cas échéant, de quelle manière. Cela concerne :
- les éléments
<input>et<textarea>. - tout élément sur lequel l'attribut
contenteditableest défini.
autocapitalize n'affecte pas le comportement lors de la saisie au clavier physique. Il influence en revanche le comportement d'autres mécanismes de saisie, tels que les claviers virtuels sur appareils mobiles ou la saisie vocale. Cela peut aider les utilisateur·ice·s en accélérant et facilitant la saisie de données, par exemple en mettant automatiquement en majuscule la première lettre de chaque phrase.
Valeurs
Les valeurs possibles sont :
noneoroff-
Ne pas mettre automatiquement en majuscule le texte.
sentencesoron-
Mettre automatiquement en majuscule le premier caractère de chaque phrase.
words-
Mettre automatiquement en majuscule le premier caractère de chaque mot.
characters-
Mettre automatiquement en majuscule chaque caractère.
Notes d'utilisation
autocapitalizepeut être défini sur les éléments<input>et<textarea>, et sur leurs éléments conteneurs<form>. Lorsqu'unautocapitalizeest défini sur un élément<form>, il définit le comportement d'autocapitalisation pour tous les<input>et<textarea>contenus, en remplaçant les valeursautocapitalizedéfinies sur les éléments enfants.autocapitalizen'a aucun effet sur les types<input>url,emailoupassword, pour lesquels l'autocapitalisation n'est jamais activée.- Lorsque
autocapitalizen'est pas défini, le comportement par défaut adopté varie selon les navigateurs. Par exemple :- Chrome et Safari utilisent par défaut
on/sentences - Firefox utilise par défaut
off/none.
- Chrome et Safari utilisent par défaut
Exemples
HTML
<p>
Formulaire pour tester les différents paramètres d'autocapitalisation :
</p>
<form>
<div>
<label for="default"
>Par défaut : pas d'autocapitalisation définie</label
>
<input type="text" id="default" name="default" />
</div>
<div>
<label for="off">autocapitalize="off"</label>
<input type="text" id="off" name="off" autocapitalize="off" />
</div>
<div>
<label for="none">autocapitalize="none"</label>
<input type="text" id="none" name="none" autocapitalize="none" />
</div>
<div>
<label for="on">autocapitalize="on"</label>
<input type="text" id="on" name="on" autocapitalize="on" />
</div>
<div>
<label for="sentences">autocapitalize="sentences"</label>
<input
type="text"
id="sentences"
name="sentences"
autocapitalize="sentences" />
</div>
<div>
<label for="words">autocapitalize="words"</label>
<input type="text" id="words" name="words" autocapitalize="words" />
</div>
<div>
<label for="characters">autocapitalize="characters"</label>
<input
type="text"
id="characters"
name="characters"
autocapitalize="characters" />
</div>
<div>
<label for="characters-ta"
>autocapitalize="characters" sur la zone de texte</label
>
<textarea
type="text"
id="characters-ta"
name="characters-ta"
autocapitalize="characters">
</textarea>
</div>
</form>
<hr />
<p contenteditable autocapitalize="characters">
Ce contenu est éditable et possède autocapitalize="characters".
</p>
Résultat
Testez l'effet sur chaque champ à l'aide d'un clavier virtuel ou de la saisie vocale (la saisie depuis un clavier physique ne fera rien).
Spécifications
| Specification |
|---|
| HTML # attr-autocapitalize |