22.04.2013 Views

HTML, XHTML & CSS

HTML, XHTML & CSS

HTML, XHTML & CSS

SHOW MORE
SHOW LESS

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

28<br />

Part IV: Scripting and (X)<strong>HTML</strong><br />

The following markup creates two text input fields — one for a first name and<br />

one for a last name:<br />

<br />

<br />

First Name: <br />

Last Name: <br />

<br />

<br />

In addition to the elements, the preceding markup includes list<br />

( and ) elements and some text to label each of the fields. By themselves,<br />

most form elements don’t give the user many clues about the type<br />

of information you want them to enter. Lists are covered in more detail in<br />

Chapter 5.<br />

You must use <strong>HTML</strong> block and inline elements to format the appearance of<br />

your form and also to supply the necessary text. Figure 14-5 shows how a<br />

browser displays this kind of <strong>HTML</strong>. (To see the <strong>HTML</strong> source that produced<br />

this figure, visit our Web site at www.dummieshtml.com, pick Chapter 14,<br />

and look at the source code for Figure 14-5.)<br />

Figure 14-5: Text entry fields in a form.<br />

You can control the size of a text field with these attributes:<br />

✓ size: The length (in characters) of the text field<br />

✓ maxlength: The maximum number of characters the user can type into<br />

the field<br />

The following markup creates a form that sets both fields to a size of 30<br />

(characters long) and a maxlength of 25 (characters long). Even though<br />

each field will be about 30 characters long, a user can type only 25 characters<br />

into each field, as shown in Figure 14-6. (Setting the size attribute greater

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!