MY CARTText Boxes in HTML5 Forms – Tutorial
Text Boxes in HTML5 Forms: Video Lesson
This video lesson, titled “Text Boxes,” shows you how to add text boxes in HTML5 to forms you create. This video lesson is from our HTML5 and CSS3 course, titled “Mastering HTML5 and CSS3 Made Easy v.1.0.”
Text Boxes in HTML5 Forms: Overview
This lesson will show you how to add text boxes to HTML5 forms you create. Text boxes in HTML5 forms are the most basic elements that forms use in the collection of data. Text boxes in HTML5 forms are typically used when the input requires a single line of text. To create a text box, you use the <input> element tag and TYPE attribute with a value of “text” and place it between the <form>…</form> tags. You must also specify a unique name for the text box using the NAME attribute.
By default, text boxes are 20 characters wide. You can change the width of the field that is displayed by using the SIZE attribute. You can also limit the number of characters the user can type into the text box by using the MAXLENGTH attribute.
| Start Tag: | <input> | No end tag. |
| Attributes: | type=“text” | Identifies the element as a text box. |
| name= | Required. | |
| size= | ||
| maxlength= | ||
| Example: | <form method=“post” action=“cgi-bin/contact.pl”><br>Your Full Name:
<input type=“text” name=“fullname” size=“50” maxlength=“45”> </form> |
|
| Result: | Creates a text box called “fullname” that is 50 characters in length and holds a maximum of 45 characters of input. |
Text Boxes in HTML5 Forms – Tutorial: A picture of a text box created within an HTML5 form.
Text Boxes in HTML5 Forms: Instructions
- To create text boxes in HTML5 forms, type: <input type=“text” name=“?”> between the <form>…</form> tags, where “?” is the required unique name for the text box.
