Form attributes, label

to sum up

I.      Form Overview

1. 1.     What is the form: the form is an area of user data can be collected: Form is crucial for the back-end developers
2. 2.    How to create a form region:

a)    represents a form with the form element

b)    represented by the action attribute of a form submission address

c)    represents a form submission method attribute

d)    in the production of static pages, you can not write the above properties

e)    in the production of static pages, it is recommended not to set form elements of style

1. 3. The    form element which can be placed

a)    for developers static pages, but a general block form the cartridge, any element can be placed inside

b)    In general, the form is placed some elements may interact with the user

Text box <input type = "text">

Click the button <input type = "buttont" value = "Click">

Submit button <input type = "submit">

 Checkbox <input type = "checkbox" name = "" value = "">

Single-box <input type = "radio" name = "" value = "">

File upload <input type = "file">

Password <input type = "password">

Reset Button <input type = "reset">

隐藏  <input type=”hidden” name =”” value=””>

Digital block <input type = "number" min = "" max = "" step = "">

Digital slider <input type = "range">

Date box <input type = "date">

Date block <input type = "month">

The first few weeks of the year <input type = "week">

Time <input type = "time">

Dropdown: <INPUT type = "text" ID = "" List = "A">

             <datalist id=”a”>

                  <option value=””></option>

                  <option value=””></option>

              </datalist>

          <select name=”” id =””>

                  <option value=””></option>

                  <option value=””></option>

          </select>

Packet <opegroup> </ opegroup>

Multiple lines of text

<textarea name=”” id=”” rows=”” cols=””></trxearea>

Information Packet

<Fielaset>

    <legend></legend>

<legend></legend>

                       </ Fielaset>

Properties: name: send to the server keys value: send to the server

      Maxlength : length required: requirements must be filled

      Pattem : Fill Rule disabled: Disable

      The Placeholder : Tip readonly: read-only

      AutoComplete : automatically identify selected: Select

      Size : Display <label> </ label> number associated

Because these interactive elements usually appear in the form, so we often call it a form element

1. 4. The   two important properties of the form element

name attribute: that is sent to the server's key name

value attribute: value indicating sent to the server

Second,    form elements - text box

Using the input element represents a text box: input is an empty element

Text box may be provided by the type attribute type

Third,          form elements - buttons

1)   the input element representing the button or button element

2)  Button There are many

a)    push button: Click without any additional effect

b)   the reset button: must appear in the form, click other form elements will be reset to the initial value

c)    submit button: you must appear in the form, submit the form data to the server will click

d)    Picture button: the same function as the submit button, but the style for a picture, the button has been rarely used

3)  the INPUT comparison and the button

A)    INPUT is an empty element, button is common elements

b)   the INPUT is the old version of the element, button is an element in HTML5

c)    the INPUT button can only write text, button richer content

D)    INPUT compatibility better, button somewhat less

Fourth,    form elements - the drop-down list

   Use select and option elements combined to pull down list

Type drop-down list: ordinary drop-down list

                Drop-down list of options grouped

Fifth,    form elements - data lists and multi-line text box

Use datalist element expression data list

Textarea element using the expression multi-line text box

<textarea name=”” id=”” rows=”” cols=””></trxearea>

VI    group elements and status form

   Using fieldset and legend elements are grouped to form content

Readonly attribute and use disabled attribute, set availability status form element

Seven,        to beautify the form elements

1,  pseudo-class focus: focusing pattern indicates time, form elements commonly used in

2,   the default style sheet element of understanding

Default to form element row box - horizontal alignment

Form elements are replaceable elements - size cassette may be provided in various parts of the model

Will outline text frame Focus