form标签:
表单作用:搜集用户填写的信息,提交给网站后台(即服务器)
属性:
- action:信息要提交的地址
- method: 浏览器向后台传输数据的方式:get或者post(区别见上一片文章)
- target:在何处打开action(用的较少)
- entype:
1.application/x-www-form-urlencoded:在发送前编码所有的字符(默认)
2.text/plain:空格转换为"+"号,但不对特殊字符编码
3.mutipart/form-data:使用包含文件上传控件的表单时,必须用该值
表单需要用form标签包围,格式如下:
<form action="信息要提交的地址" method="post/get"></form>
常见input标签及属性
- input标签使用type属性的值来规定input元素的类型,常见有以下类型:
常见:
type | 作用 |
---|---|
text | 定义单行输入框,可在其中输入文本 |
password | 密码输入框,输入的内容在页面上以圆点展示 |
checkbox | 定义复选框 |
radio | 定义单选框 |
file | 定义输入字段和“浏览”按钮,供文件上传 |
hidden | 隐藏的标签。可以用来发送默认项或者进行安全校验 |
button | 定义可点击的按钮,不可提交 |
submit | 定义提交按钮,把表单数据发给服务器 |
reset | 定义重置按钮,用于清除表单中的用户输入的数据 |
image | 定义图像形式的提交按钮 |
非常见:
type | 作用 |
---|---|
url | URL的绝对地址 |
邮件地址 | |
search | 无换行的搜索框 |
tel | 无换行的电话号码框 |
date 日期输入框,可以选择日期 | |
time | 时间输入框 |
number | 数字输入框,整数小数都可以 |
range | 范围选择框,0~100 |
color | 选择颜色 |
select标签
- 下拉菜单
- 格式:
<select name="aa" id="bb">
<option value="xx">xx</option>
</select>
注:在option标签中加一个selected表示默认选择
taxtarea标签
- 一个可以多行输入的文本框
- 格式:
<textarea name="comment" id="comment" cols="30" rows="10">ddd</textarea>
label标签
- for属性可以与input的id属性配合,点击输入框前的文字时,也能进入focus状态