Cette page a été traduite à partir de l'anglais par la communauté.Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.
Attribut HTML : size
L'attributsize définit la largeur de l'élément HTML<input> et la hauteur de l'élément<select>. Pour un élémentinput, il définit le nombre de caractères que l'agent utilisateur permet à l'utilisateur·ice de voir lors de la modification de la valeur. Pour un élémentselect, il définit le nombre d'options qui doivent être affichées à l'utilisateur·ice. Il doit s'agir d'un entier non négatif valide supérieur à zéro.
Si aucunsize n'est défini, ou si une valeur invalide est définie, l'entrée n'a pas de taille déclarée et le contrôle de formulaire aura la largeur par défaut selon l'agent utilisateur. Si du CSS cible l'élément avec des propriétés impactant la largeur, le CSS prévaut.
L'attributsize n'a aucun impact sur la validation des contraintes.
Dans cet article
Exemple interactif
<label for="firstName">Prénom :</label><input name="firstName" type="text" size="10" /><label for="lastName">Nom :</label><input name="lastName" type="text" size="20" /><label for="fruit">Fruit préféré :</label><select name="fruit" size="2"> <option>Orange</option> <option>Banane</option> <option>Pomme</option></select>label { display: block; margin-top: 1rem;}Exemples
En ajoutantsize sur certains types d'entrée, la largeur de l'entrée peut être contrôlée. L'ajout de la taille sur une sélection modifie la hauteur, définissant le nombre d'options visibles à l'état fermé.
<label for="fruit">Entrez un fruit</label><input type="text" size="15" /><label for="vegetable">Entrez un légume</label><input type="text" /><select name="fruits" size="5"> <option>banane</option> <option>cerise</option> <option>fraise</option> <option>durian</option> <option>myrtille</option></select><select name="vegetables" size="5"> <option>carotte</option> <option>concombre</option> <option>chou-fleur</option> <option>céleri</option> <option>feuilles de collard</option></select>Spécifications
| Specification |
|---|
| HTML> # attr-select-size> |
| HTML> # attr-input-size> |