HTML-form form

Form form for users to log in, register, submit other scenes, all the data to be submitted must be placed form tag <form action = "" method = "">;

action: submit address, action, and submit input tag type attribute tag is associated. <Input type = "submit" value = "submit" />, is submitted to the action address address

method: submission method, there are two kinds of get and post submission method.

    get: Submit data can be seen in the URL,

               (1) to pass parameters http://reg.email.163.com/unireg/call.do?cmd=register.entrance&from=126mail

       (2) URL length is limited, so the parameter data passed there limit

       (3) Since the data can be seen, therefore unsafe

       (4) The default Web page request is get

    post method:   

       (1) the form data stored in the http request

       (2) there is no length limit

       Data (3) submitted url is invisible, relatively safe

       (4) Development often used to submit data post form submission form

       (5) File Upload method = post enctype = multipart / form-data

Form tag

<form> Form definition for user input
<input> Define the input field
<textarea> Defined text field (a multi-line input control)
<label> Tag defines the <input> element, typically enter a title
<fieldset> It defines a set of related form elements, comprising a frame and use them
<legend> The title defines the <fieldset> element
<select> It defines the drop-down list of options
<optgroup> Defined set of options
<option> Defined drop-down list of options
<button> Define a click of a button
<datalist>     New Enter a specified list of predefined control options
<keygen>     New Defined form key pair generator field
<output>      New Define a calculation

 

The input tag: input box that common properties as follows:

name: Specifies the name of the input box for easy submission form;

value: attribute value, the contents of the text box;

placeholder: default text box can be used to display content;

readonly: read-only character input box can not be modified;

disabled: disabled;

size: Since the input frame is a single line, you can set the width;

Limiting the maximum number of characters entered input box;: maxlength

property type:

text: plain text, the default properties;

password: text passwords entered content is not displayed normally used to set a password;

submit: submit button;

checkbox: check boxes, multiple selection;

lable: single box, a plurality of options associated with keeping the name attribute, <labke for = ""> </ lable>: radio buttons and text for association;

hidden: hidden fields, not in the page display;

Drop-down box

select: drop-down selection box, you can set the property name, each option has an option, select the Use selected by default

籍贯:<select name="from">
         <option value="bj">北京</option>
         <option value="sh">上海</option>
         <option value="gz">广州</option>
         <option value="sz">深圳</option>
      </select>

  

Text fields

textarea: text field, enter multiple lines of text;

Attributes:

cols: Number (width) column

rows: the number (height) line

<! DOCTYPE HTML> 
<HTML> 
	<head> 
		<Meta charset = "UTF-. 8" /> 
		<title> form Form </ title> 
	</ head> 
	<body> 
		<form> 
			<-! Text box -> 
			username: <input type = "text" placeholder = " Please enter your user name" /> 
			<the iNPUT of the type = "the Button" value = "click" /> <br />   
			password: <input type = "password" placeholder = "Please enter your password" /> 
			<the iNPUT of the type = "the Submit" value = "Please confirm" /> 
			<br /> 
			<the iNPUT of the type = "hidden" value = "hidden" /> 
			<! - check box -> 
			What's your favorite fruit? <br /> 
			Apple <input type = "checkbox"
			<input type = "radio" name = "sex" id = "nan" value = "0" / checked = "a"> <label for = "nan"> M </ label> 
			 <INPUT type = "Radio" name = "sex" id = "nv " /> <label for = "nv"> female </ label> 
			<br /> 
			<- drop-down list ->! 
			Please select your favorite subject: 
			<the sELECT size = "1 "name =" form "> 
				<the Option> language </ the Option> 
				<the Option the Selected =" the Selected "> math </ the Option> 
				<the Option> English </ the Option> 
			</ the SELECT> 
		</ form> 
		<-! text field -> 
		<TextArea cols = "20 is" rows = "20 is"> Please enter your </ TextArea> 
	</ body>
</html>

g

 

Guess you like

Origin www.cnblogs.com/webdelovely/p/11411811.html