HTML之表单标签小结

Form表单

---

action：表单提交的地址

method：用来指定数据传递到服务器的基本方法，

1：get：传递的数据会拼接到url后面

优点：简单，快速

缺点：暴露敏感信息，数据传输量有限

2：post：传递的数据会隐藏起来，放在请求体

优点：数据传输量大，信息保密性好

缺点：相比get请求，速度慢一些

<formaction="www.dsfaga.fsdf" method="get">

---

fieldest：表单外边框

legend：表单标题

<form....>

<fieldset style="width: 398px">

<legend>个人信息</legend>

..............

</fieldset>

</form>

---

input：输入框text：文本输入，可见

password：密码输入，不可见

tabindex：指定安Tab键光标跳转的顺序

autocomplete：自动补全功能off：关闭 on：打开

autofocus：自动获得焦点即自动使光标出现在这一行

required：必填pattern：验证input的模式

placeholder：使输入框内出现灰色提示字段

姓名：<input type="text" name="name" tabindex="1"autocomplete="off"

autofocusrequired placeholder="请输入姓名"><br>

密码1：<input type="password"tabindex="4" placeholder="请输入密码"><br>

密码2：<input type="password" tabindex="3"><br>

密码3：<input type="password" tabindex="2"><br>

---

radio：单选checkbox：多选

name：当属性相同是只选一个

label：可使点击字和框时都可以选中

value：规定输入字段的初始值

性别：<input type="radio" name="sex" value="1"id="man"><labelfor="man">男</label>

<input type="radio" name="sex" value="0" id="women"><label for="women">女</label><br>

爱好：<input type="checkbox" name="hobby" value="basketball">篮球

<input type="checkbox" name="hobby" value="tennis">网球

<input type="checkbox" name="hobby" value="score">足球 <br>

---

select：下拉框

selected：默认选定

option：定义带选择的选项

省份：<selectname="provience" id="p">

<option value="sd">山东省</option>

<option value="hn"selected>河南省</option>

</select>

---

file：上传文件

image：图形提交按钮

附件：<input type="file" name="img"><br>

图形按钮: <input type="image" src="../../img/3.jpg" width="200" height="100"><br>

---

textarea：文本域

style="resize: none：使文本域不能缩放

button：普通按钮

submit：提交按钮

reset：重置表单数据

意见建议：<textarea style="resize: none" rows="5" cols="18"></textarea><br>

<input type="button" value="注册" >

<input type="submit" value="登录">

<input type="reset" value="清空"><br>

---

email：限制输入email格式

邮箱：<input type="email">

url：限制输入网址格式

网址：<input type="url">

date：限制输入日期格式

日期：<input type="date">

time：限制输时间格式

时间：<input type="time">

month：限制输入月份格式

月份：<input type="month">

week：限制输入周格式

周期：<input type="week">

number：限制输入数字格式

max="10" min="3" step="2":输入框的最大值，最小值，步长-->

数字：<input type="number" max="10" min="3" step="2">

range：一个滑动条效果

滑动：<input type="range">

color：选择颜色格式

颜色：<input type="color">