50. html supplement, 50 html supplement
<Body> common internal labels <div> and <span>
<Div> </div>: <div> it is only a block-level element and has no practical significance. It mainly uses CSS styles to give it different representations.
<Span> </span>: <span> indicates an inline row (an element in a row), which has no practical significance. It is mainly presented with different expressions through CSS styles.
Differences between block-level elements and intra-row Elements
The so-called block element is the element that starts rendering with another line. The element in the row does not need to start with another line. If these two elements are inserted separately in the webpage, the page will not be affected.
These two elements are created specifically to define CSS styles.
List tag
''' <Ul>: unordered list [type attribute: disc (solid dot) (default), circle (hollow circle), square (solid square)] <ol>: ordered list <li>: each item in the list. <dl> definition list <dt> List title <dd> list item '''
Form Tag: <form>
Function: form is used to transmit data to the server to realize user interaction with the Web server.
A form can contain input series tags, such as text fields, check boxes, single quotes, and submit buttons.
The form can also contain textarea, select, fieldset, and label labels.
Form attributes
Action: Where the form is submitted. generally pointing to a program on the server side, the program receives the data submitted by the form (that is, the form Element value) for the corresponding processing, such as https://www.sogou.com/web
Method: Form submission method. The default value of post/get is get.
Form Element
Basic concepts:
HTML forms are complex parts of HTML elements. They are often combined with scripts, dynamic pages, and data processing functions. Therefore, HTML forms are important for creating dynamic websites.
Forms are generally used to collect user input information.
How the form works:
When you browse a webpage with a form, you can enter the required information and click a button to submit it. The information is transmitted to the server over the Internet.
A special program on the server processes the data. If there is a mistake, the system returns the error message and requires that the error be corrected. When the data is complete, the server returns an input information
<Input> series labels
''' <1> Form Type
Type: text input box password Input box radio single ‑checkbox multiple selection box submit button (need to use with js.) What is the difference between button and submit? File: To submit a file, add the attribute enctype = "multipart/form-data" to the form to upload the file. Note: 1. The request method must be post 2 enctype = "multipart/form-data"
<2> form attributes
Name: Key of the Form submission item. note: The name attribute is the name used to communicate with the server, and the id attribute is the name used by the browser. This attribute is mainly used to facilitate client programming, the value used in css and javascript: the value of the Form submission item. for different input types, the usage of the value attribute is also different: type = "button", "reset", "submit"-defines the text type = "text" displayed on the button ", "password", "hidden"-defines the initial value of the input field type = "checkbox", "radio", "image"-defines the value checked associated with the input: radio and checkbox are selected by default readonly: read-only. text and passworddisabled. '''
Select tag
''' <Select> select the label attribute name from the drop-down list: the Key of the Form submission item. size: Number of options. multiple: multiple <optgroup> adds a group to each item. <option> Each attribute selected in the drop-down list: value: the value of the Form submission item. selected: Select ''' by default from the selected drop-down list '''
<Textarea> multi-line text box
''' <Form id = "form1" name = "form1" method = "post" action = ""> <textarea cols = "width" rows = "height" name =" name "> default content </textarea> </form> '''
<Label> label
Definition: <label> label defines the annotation (TAG) for the input element ).
Note:
1. The label element does not show any special effects to users.
2 <label> The for Attribute Value of the label should be the same as the id attribute value of the related element.
''' <Form method = "post" action = ""> <label for = "username"> User name </label> <input type = "text" name = "username" id = "username" size = "20"/> </form> '''
<Fieldset> label
''' <Fieldset> <legend> log on </legend> <input type = "text"> </fieldset> '''