Introduction to HTML forms

This article introduces you to the introduction of HTML forms, tables and media elements. It has a good reference value and I hope it can help friends in need.

Form tag form:

//Equivalent to a list that records user information
Common attributes: method: form submission method, there are two commonly used values
(1) Post: Security Submission method
(2) Get: non -security submission method
Example: & lt; form method = "post" & gt; & lt;/from & gt: Where to go
Example:

The form contains the form element inout tag, which is used to allow users to input content
It should be noted that form elements should be written between form tags, not outside the form
Commonly used form elements:
(1): Text box, where content can be input
         Form elements can also set the default value value attribute: value="123"
(2) : Password box, the input content will be hidden
                                                                                 The element must set the name attribute, which is used to identify the name of the form element
(3): Submit button, the form will be submitted after clicking it
The form element sets what type of input box or button it is through type
(4): Reset button, clicking it will make the input box in the form return To the initial state
(5): Radio button,
You can only select one radio button in the same group, use name To group, for example, gender: names are both sex. If the name values ​​are different, it means they are not in the same group. When submitting, the value is submitted,
(6) Multiple selection boxes, grouped by name, can be multiple-selected, submitted The value is submitted at the time
PS: Radio buttons and multi-select buttons can set the default selected items by setting the checked attribute

(7)

List item 1
                                                                                    List item 3


(8)Image button
Make the button look like a picture, and click it to submit the form

(9)< ;input type="button" value="Display text"/>Normal button

A button that has no function will be very commonly used in the future
Note: If the type attribute is not set, the default type attribute is text
(10)Text area, you can display multiple lines of content or input
(11)File field, you can choose a file to upload
To upload a file, you also need to set the enctype attribute in the form tag to multipary/form-data.
(12)Email box, you must enter a correct email format before you can submit the form
 There will be a prompt if there is an error

(13)In the URL box, a complete URL must be entered, such as: http://www.baidu.com
(14)In the number box, only numbers can be entered.
        The form cannot be submitted if other characters are entered.
（15）Slider, you can slide left and right
（16）Search box, different browsers will display it in different styles
(17)You can choose the color
(18) Form primary verification: Placehoder prompt content, Require non -empty judgment
Pattern regular expression verification
t: & lt; input type = "text "Placehoder =" Please enter the name "/& gt;
# & lt; input Type =" Text "Require/& GT; // This input box cannot be empty.
Hidden fields:

Hidden fields are content that users cannot see. They can be used to distinguish forms.

Read-only : & Lt; input type = "text" readonly/& gt;
Settings only read the attribute, the input box content cannot be changed
, but you will get the cursor, or you can be selected from
: & lt; input type = "text" disabled/>
                                                                                                                                                             The element can't be used, the cursor cannot be obtained, becomes gray, and cannot be selected
    Form annotation: When text is clicked, the corresponding form element gets focus, enhancing the usability of the mouse
                                                                                                                                                                                                                                                               through The id value of the element

Related recommendations:


Introduction to lists, tables and media elements in HTML

Introduction to HTML formats and tags

The above is the detailed content of Introduction to HTML forms. For more information, please follow other related articles on the PHP Chinese website!