Web Development and Design Foundations with XHTML, 5th Edition

(Steven Felgate) #1

(^366) Chapter 9 XHTML Forms
Figure 9.15
The new version of
the contact form
Launch Notepad and open the contact.html page that you created in Hands-On Practice
9.1. Perform the following edits:



  1. Place the cursor after the
    tag and press eto create a new line.
    Configure the area where the customer name will be entered. Type Name:to cre-
    ate the label for the text box. Now create an tag that has type config-
    ured to text, nameset to CustName, idset to CustName, and sizeconfigured to
    30. The label and text box should be on their own line. (Hint: Use two

    elements.) The XHTML follows:
    Name:



  2. Verify that the e-mail form element you coded in Hands-On Practice 9.1 is on the
    next line. The XHTML follows:
    E-mail:



  3. Press eto create a new line under the E-mail text box. Type Phone: to create
    the label for the text box. Now create an tag that has type configured
    to text, nameset to CustPhone, idset to CustPhone, sizeconfigured to 15 ,
    and maxlengthset to 12. View Figure 9.16 and notice that the phone number
    text box initially displays the characters ###-###-####. Configure this by setting
    the valueattribute to ###-###-####. The label and text box should be on their
    own line. The XHTML follows:
    Phone: <input type="text" name="CustPhone" id="CustPhone"
    size="15" maxlength="12" value="###-###-####" />



  4. Now you will configure the area for customer comments or questions. On its
    own line, type Question or Comments: Use a
    element to cause this
    text to display on its own line in the Web browser. Next, configure a scrolling
    text box with 4 rows, 60 columns, the name CustComment, and the idset to
    CustComment. Configure the default text to display between the tags as Please type your question or comment here.

Free download pdf