html学习之四:表单

form
格式:
<form action="url" method="get/post">
</form>
url:指明了处理表单信息的文件
method:表示了发送表单信息的方式。method有两个值：get和post。get的方式是将表单控件name/value信息经过编码之后，通过URL发送(你可以在地址栏里看到)。而post则将表单的内容通过http发送，你在地址栏看不到表单的提交信息。那什么时候用get，什么时候用post呢？一般是这样来判断的，如果只是为取得和显示数据，用get；一旦涉及数据的保存和更新，那么建议用post。

1.单行文本框(text)
(1)格式:
<input type="text" name="名字" value="初始值">
(2)属性:
   type:text标明控件是单行文本框
   name:单行文本框名称
   value:单行文本框初始值
(3)例:
     <input type="text"  name="yourname" value="在这里输入您的名字">

2.多行文本框(textarea)
(1)格式:
<textarea
  name="comment" cols="30" rows="5">
</textarea>

(2)属性:
     name:控件名称
     cols:宽度
     rows:高度
注:这个表单控件和其它的不同,没有"input=",且有开始标记和结束标记.
(3)例:
     <textarea
        name="comment" cols="30" rows="6">
     </textarea>

3.密码输入框(password)
(1)格式:
<input type="password" name="名称">
(2)属性:
   type:password标明该控件为密码文本框
   name:控件名称
(3)例:
     用户名:
     <input type="text" name="username"><br>
       密码:
     <input type="password" name="pwd"><br>
注:当用户在该文本框内输入时,输入值显示为黑色实心圆点

4.提交按钮(submit  button)
(1)格式:
<input type="submit" value="按钮文字">
(2)属性:
  type:submit标明该控件为按钮
  value:按钮上显示的文字
(3)例:
<input type="submit" value="提交">

5.单选框(radio)
(1)格式:
<input type="radio" name="单选框名称" value="单选框值">"label"
(2)属性:
   type:标明控件为单选框
   name:单选框名称,在一块的单选框的此属性必须相同,否则不是多选一
   value:各个单选框的值,唯一标识该单选框
其中label代表单选框后的文字
(3)例:
     性别:
     <input type="radio" name="sex" value="man" checked>男
     <input type="radio" name="sex" value="woman">女<br>
注:checked表示"男"单选框默认被选中

6.复选框(checkbox)
(1)格式:
<input type="checkbox" name="名称" value="复选框值">"label"
(2)属性:
   type:checkbox标明该控件为复选框
   name:该控件名称,在一块的各复选框的此属性值必须相同
   value:各复选框标识
其中label代表复选框后的文字
(3)例:
     您的考试科目为:<br>
     <input type="checkbox" name="subject"  value="politics" checked>政治<br>
     <input type="checkbox" name="subject"  value="english">英语<br>
     <input type="checkbox" name="subject"  value="math" checked>数学<br>
     <input type="checkbox" name="subject"  value="ds">数据结构<br>

7.下拉框(select)
(1)格式:
<select name="名称">
  <option value="value1">label1
  <option value="value2">label2
  <option value="value3">label3
  ……
</select>
(2)属性：
select标记标明中间是下拉框列表
name:控件名称
option:选项
value:标识某一下拉列表选项
labeln表示下拉列表选项名称
(3)例：
     你来自于哪个省?
     <select name="province">
       <option value="shandong">山东</option>
       <option value="shanghai">上海</option>
       <option value="beijing" >北京</option>
     </select>

注:不管是checkbox,还是radio,属性name必须相同
如
<form action="http://" method="get">性别:
<input type="radio" name="sex" value="man">男
<input type="radio" name="sx" value="woman">女
</form>
两个radio的name属性不同,则两个可同时被选中