# Tags

## <pre>

Preformatted text 预格式化的文本

Text in a <pre> element is displayed in a fixed-width font, and the text preserves both spaces and line breaks. The text will be displayed exactly as written in the HTML source code.

# Forms

## Forms

An HTML form is used to collect user input. The user input is most often sent to a server for processing.

### <form>

The <form> element is a container for different types of input elements, such as: text fields, checkboxes, radio buttons, submit buttons, etc.

### <input>

The HTML <input> element is the most used form element.

An <input> element can be displayed in many ways, depending on the type attribute.

Here are some examples:

TypeDescription
<input type="text">Displays a single-line text input field
<input type="radio">Displays a radio button (for selecting one of many choices)
<input type="checkbox">Displays a checkbox (for selecting zero or more of many choices)
<input type="submit">Displays a submit button (for submitting the form)
<input type="button">Displays a clickable button

### <input type="text">

The <input type="text"> defines a single-line input field for text input.

Example:

### <label>

The <label> tag defines a label for many form elements.

Notice the use of the <label> element in the example above.

The <label> element also help users who have difficulty clicking on very small regions (such as radio buttons or checkboxes)

The for attribute of the <label> tag should be equal to the id attribute of the <input> element to bind them together.

### <input type="radio">

The <input type="radio"> defines a radio button.

Radio buttons let a user select ONE of a limited number of choices.

Example:

### <input type="checkbox">

The <input type="checkbox"> defines a checkbox.

Checkboxes let a user select ZERO or MORE options of a limited number of choices.

### <input type="submit">

The <input type="submit"> defines a button for submitting the form data to a form-handler.

### The Name Attribute for <input>

Notice that each input field must have a name attribute to be submitted.

Tip: If the name attribute is omitted（省略）, the value of the input field will not be sent at all.

## Form Attributes 表单属性

### Action

The action attribute defines the action to be performed when the form is submitted.

Usually, the form data is sent to a file on the server when the user clicks on the submit button.

Example:

On submit, send form data to "action_page.php":

Tip: If the action attribute is omitted, the action is set to the current page.

### Target

The target attribute specifies where to display the response that is received after submitting the form.

The target attribute can have one of the following values:

ValueDescription
_blankThe response is displayed in a new window or tab
_selfThe response is displayed in the current window
_parentThe response is displayed in the parent frame
_topThe response is displayed in the full body of the window
framenameThe response is displayed in a named iframe

### Method

The method attribute specifies the HTTP method to be used when submitting the form data.

The form-data can be sent as URL variables (with method="get") or as HTTP post transaction (with method="post").

Example: <form action="/action_page.php" method="get">

Notes on GET:

• Appends the form data to the URL, in name/value pairs
• NEVER use GET to send sensitive data! (the submitted form data is visible in the URL!)
• The length of a URL is limited (2048 characters)
• GET is good for non-secure data, like query strings in Google
• Useful for form submissions where a user wants to bookmark the result

Notes on POST:

• Appends the form data inside the body of the HTTP request (the submitted form data is not shown in the URL)
• POST has no size limitations, and can be used to send large amounts of data.
• Form submissions with POST cannot be bookmarked
• Always use POST if the form data contains sensitive or personal information!

### Autocomplete 自动补全

The autocomplete attribute specifies whether a form should have autocomplete on or off.

When autocomplete is on, the browser automatically complete values based on values that the user has entered before.

Example: <form action="/action_page.php" autocomplete="on">

### Novalidate

The novalidate attribute is a boolean attribute.

When present, it specifies that the form-data (input) should not be validated when submitted.

Example:

TODO

☕欲知后事如何，