首页 > 代码库 > HTML_02_表单

HTML_02_表单

表单:
表单标签是<form></form>这个标签和from特别像,几乎每个人都会写错,
即使知道,也会错滴,表单是最常见的标签,用于人机交互,最常见的就
是input标签,input标签中type有几个属性:text(文本框),password(密码),
checkbox(复选框),radio(单选框),hidden(隐藏框,submit(提交),reset(重置)select(选择)
eg:
<form action=" url"  method="post/get">
用户名:<input type="text" name="user"  value=http://www.mamicode.com/"" />
密码:<input type="password" name="psw" value=http://www.mamicode.com/"" />
********复选框*******
<input type="checkbox" name="checkbox1" value=http://www.mamicode.com/"" > 橙子
<input type="checkbox" name="checkbox2" value=http://www.mamicode.com/"" > 香蕉
<input type="checkbox" name="checkbox3" value=http://www.mamicode.com/"" > 菠萝
********单选框********
<input type="radio" name="radio1" value=http://www.mamicode.com/" "> 男
<input type="radio" name="radio1" value=http://www.mamicode.com/" "> 女
********sclect**********
<select>
<option value=http://www.mamicode.com/" " selected>北京
<option value=http://www.mamicode.com/" ">上海
<option value=http://www.mamicode.com/" ">张掖
</select>
********文本域*****
<option type="textarea"  name=" " value=http://www.mamicode.com/" " />
********登录*******
<input type="submit" name="登录 " value=http://www.mamicode.com/" "/>
*******重置********
<input type="reset" name="重置 "  value=http://www.mamicode.com/" " />
</form>
注意的几点:
1. form的传递方式method:
post:是隐藏传递,不显示密码和相关信息,但是
get:默认传递方式,会传递密码和相关信息。
2.每个form表单都会有name,type和value,type是表示表单的种类,
name是在界面上显示的名字,但不是真正进行传递的name,而是
value属性。
3.在复选框中name属性不要一致,单选框中名字必须一致。
4.slect中默认显示第一个,如果不想默认显示第一个,可以在option后面
输入selected。这里有个小技巧,就是通过一个没有实际意义的表option
来控制一些东西。
eg:
<select>
<option>---请选择---</option>
<option>北京</option>
<option>上海</option>
<option>张掖</option>
</select>
这样第一个默认显示请选择,并且选择框的宽度会根据第一个的宽度变得很宽。