La zone
Un élément textarea crée une zone ou un espace spécifié à l'aide d'attributs tels que des colonnes, des lignes ou les deux. Le style CSS et les propriétés de hauteur et de largeur peuvent formater l'apparence.
Syntaxe :
<textarea rows="3" cols="20"> Enter your text here... </textarea>
La zone
Pour mieux comprendre le travail de l'élément de zone de texte, consultez l'exemple suivant qui a
Code :
<form> <p>Leave your Comment:</p> <br /> <textarea id="ta" cols="60" rows="5"> Write Here...</textarea></form>
Sortie :
L'exemple ci-dessus est simple et démontre les fonctionnalités de
Les lignes et les colonnes permettent au programmeur de définir les valeurs limites pour la taille de la zone de texte, l'espace exact que la zone de texte acquerra. L'utilisation de ces attributs contribue à la prise en charge entre navigateurs et à la cohérence du format, car les paramètres par défaut du navigateur peuvent être différents.
Code :
<!DOCTYPE html> <html> <head> <title> Textarea HTML Tag Demo </title> </head> <body> <form> <p>Fill the Detail:</p> <br /> <textarea rows="5" cols="40" name="demo" maxlength="60" minlength="10" required="required">Enter your name</textarea> <br /> <input type="submit" name="Submit" value="Submit" /> </form> </body> </html>
Sortie :
L'exemple ci-dessus montre un autre ensemble de propriétés utilisées avec
L'attribut de longueur maximale a été ajouté en HTML5 ; HTML ne prenait pas en charge cet attribut. La zone de texte nécessite un minimum de 10 caractères, tel que défini par la propriété « minlength ». L'attribut « obligatoire » indique que l'utilisateur ne doit pas laisser la zone de texte vide pour être considéré comme valide et soumis. C'est une simple validation du tag.
Code :
<form id="Form1"> <label>Textarea Box 1</label> <br /> <textarea rows="5" cols="40" name="demo" maxlength="60" minlength="10" disabled="disabled"> This is Disabled</textarea> <br /> <label>Textarea Box 2</label> <br /> <textarea rows="5" cols="40" required="required"></textarea> <br /> <label>Textarea Box 3</label> <br /> <textarea rows="5" cols="40" placeholder="This is readonly textarea" readonly="readonly"></textarea> <br /> <input type="submit" name="Submit" value="Submit" /> </form>
Sortie :
Observez que la zone de texte « Textarea Box 2 » est une zone de texte obligatoire, alors que la « Textarea Box 1 » est désactivée.
Code :
<form id="label2" action="textareaDemo.html"> <fieldset> <legend><b>Form 2</b></legend> <input type="text" name="FN" value="Name" /> <br /> <input type="submit" name="Submit" value="Submit" /> <br /> </fieldset> </form> <textarea rows="5" cols="40" form="label2" required="required"></textarea> <br /> <p>Above Text Area belongs to 'Form 2'</p>
Sortie :
Notez le résultat ci-dessous. La zone de texte ci-dessous est un champ « obligatoire » et, comme mentionné dans le code ci-dessus, ce champ est associé au formulaire « Formulaire 2 ». Ainsi, lorsque nous essayons de soumettre le formulaire avec une zone de texte vide, une alerte s'affiche.
La zone
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!