C777 Chapter 8

two important points about form input elements:

* If the type attribute is omitted, then the browser will infer the default type of text. * If the specified value of the type attribute is not supported, the browser will ignore the value and infer the default type of text.

The HTML5 global attributes that can be used with the <fieldset> element are:

* form — specifies the form(s) on the page in which the <fieldset> element appears * name — specifies a name for the <fieldset> element that can be used to reference it * disabled — disables a group of related form elements

HTML5 introduces many semantic elements and attributes

<section>, <aside> and <footer>

New HTML5 Form Element <keygen>

Adds security to a form through asymmetric encryption by creating a key-pair generator field in the form. Generates a key pair (one private key and one public key) upon form submission. The public key is sent to the server, whereas the private key is stored on the local machine

datetime

Allows the user to choose a date and time with a GMT time zone

datetime-local

Allows the user to choose a date and time with a local time zone

month

Allows the user to choose a date using the month and year (without time zone)

week

Allows the user to choose a date using the week and year (without time zone)

url

Allows the user to enter a URL, such as an http://, ftp:// or mailto: address

date

Allows the user to enter a date (without time zone) using a drop-down date-picker calendar

time

Allows the user to enter a time (without time zone)

range

Allows the user to enter numbers using a slider control

number

Allows the user to enter rational integers or float values

autofocus

Applies focus on the element when the page loads

CSS

Border and spacing in a fieldset group can be controlled using _________.

<select>

Creates a drop-down selection list.

disabled

Disables the element

New HTML5 Form Element <output>

Displays the result when a calculation is performed

Wufoo.com hosts an

HTML5 Browser Support page

HTML5 Global Attribute required

Requires the user to select or enter a value before the form can be submitted

New HTML5 Form Element <datalist>

Specifies a list of pre-defined choices for an <input> element. Users see the pre-defined choices in a drop-down list that narrows according to any user input. This field also features the autocomplete function for user input

HTML5 Global Attribute name

Specifies a name for the element that can be used to reference it

HTML5 Global Attribute placeholder

Specifies a short description to provide the user with a hint about the expected input in the field. The placeholder value appears before the user enters any input, and it disappears when the user enters a character in the field

HTML5 Global Attribute for

Specifies the IDs of elements whose values were used

HTML5 Global Attribute form

Specifies the form(s) on the page in which the element appears

HTML5 Global Attribute maxlength

Specifies the maximum number of characters that can be entered in the field by the user

HTML5 Global Attribute wrap

Specifies whether text submitted in a form field is to be wrapped. Default is "soft" (not wrapped). Wrapped ("hard") text input will contain newlines (i.e., returns) when submitted

autocomplete

The <datalist> element provides pre-defined options that sort and complete themselves as users type into the field.

type attribute

The <input> element uses the _____________ to identify the input control for users.

The <label> element enables you to add

a label to an input element in a form. Users can click the label text to toggle between the controls, such as selected and not selected. This improves usability in the form.

the <textarea> element identifies

a multi-line text input control. The element allows an unlimited character length, but developers usually define the size by adding the rows and cols attributes. The text that users enter typically defaults to Courier font with a fixed width.

The HTML <legend> element

allows you to add a caption for a group of items created by the <fieldset> element. The caption appears at the top of the box that surrounds the related fields. This type of caption makes a form easier for users to understand, navigate and reference.

HTML5 min and max attributes

an be used with various input types to set limits on number ranges.

semantic elements and attributes

clearly describe their purpose to a human reading the code.

The <input> tag is still used to

create many types of form fields

The HTML5 global attributes that can be used with the <label> element are:

form — specifies the form(s) on the page in which the <label> element appears by binding the label to the form (using the <form> element's id attribute) for — binds the label to its related input type (using the input's id attribute)

The <fieldset> element is used to

group elements so that related fields are placed together in a form. It creates a box around the related fields, which helps to group and separate them on the screen.

CanIUse.com site hosts a page

includes the latest status of HTML5 and CSS3 browser support.

Graceful degradation

is a term used to describe the backward-compatibility of code.

The autofocus attribute

selects the specified field so that when a user starts typing, the text enters into the field identified with the autofocus attribute.

The <label> element is especially useful for

semantics and accessibility, which are current concerns in Web page design.

To use the <datalist> element, you must use

the <input> element's list attribute to bind it to the input field. The datalist does not work unless you bind these two elements together.