Forms: HTML
Create Text and Password Boxes

The Text Box

The Password Box

Remember that you create a form field with the <FORM></FORM> tag pair.

Within the <FORM> tags will go the entire form, i.e. both the questions you ask and the form elements, i., e., the  box and button spaces where the user will supply responses

To create most form elements, use the following code:
<INPUT TYPE="[form]" NAME="[name]">
This tag does not require a closing tag
  • The TYPE attribute specifies the kind of form element (e.g., text box, button, etc.) you want to display.
  • The NAME attribute specifies the class of information being gathered by that particular form element.
  • When the information is processed by the server it will be identified by the term you assign to the NAME attribute.
The Text Box The text box form element asks for one line of text, e.g., a name or a street address.
Example

Last Name First Name

The HTML code used to create a text box is :
<INPUT TYPE="text" NAME="[name]">
You can also use SIZE and MAXLENGTH attributes within the <INPUT> tag.
SIZE ="[n]" where [n] is the number of characters that will fit in the box as it is displayed on the screen; the default is 20.

MAXLENGTH="[n]" where [n] is the number of characters that can be entered into the box. 

Use the MAXLENGTH attribute to limit user input (e.g., for a zip code or password).

The code for the text box example above would be:
Last Name <INPUT TYPE="text" NAME="lastname">
First Name <INPUT TYPE="text" NAME="firstname">
Remember that this code goes within the <FORM></FORM> tag pair
The Password Box The password box is similar to the text box except that the input data appears on the screen as asterisks.

The HTML to create a password box is:

<INPUT TYPE="password" NAME="[name]" SIZE="[n]" MAXLENGTH="[n]">
Remember that this code goes within the <FORM></FORM> tag pair.
Remember that "name" is the term you use to identify the value you assign to the data being collected in the form element.

It's probably a good idea to limit the maximum length of a password to 6-8 characters and to set the size of the password box to display only that length.

Forms: HTML
Overview
Create a Form
Create Text and Password Boxes
Create Radio Buttons
Create Checkboxes
Create Menu Boxes
Create Text Blocks
Create the Reset and Submit Buttons

Personal Home PageWeb Design CenterTutorial MenuTop of Page

Web Design Center
Last Revised: October 19, 2006
© Agatha Taormina