前端进阶——表单标签
input控件——常用属性
- 语法:
<input type="属性值" value="你好" />
- 常用属性:
属性 | 属性值 | 描述 |
---|---|---|
type | text | 单行文字输入框 |
password | 密码输入框 | |
radio | 单选按钮 | |
checkbox | 复选框 | |
button | 普通按钮 | |
submit | 提交按钮 | |
reset | 重置按钮 | |
image | 图像形式的提交按钮 | |
file | 文件域(上传头像等) | |
name | 用户自定义 | 控件的名称 |
value | 用户自定义 | input控件中的默认文本值 |
size | 正整数 | input控件在页面中的显示宽度 |
checked | checked | 定义选择控件默认被选中的项 |
maxlength | 正整数 | 控件允许输入的最多字符数 |
name属性
label标签
label标签为input元素定义标注(标签)
作用:
用于绑定一个表单元素,当点击label标签的时候就会获得输入焦点。
用法一:
<label> 用户名: <input type = "radio" name = "usename" value = "请输入用户名"> </label>
适合单个表单选择
用法二:
<label for = "sex" > 男 </label>
<input type = "radio" name = "sex" id = "sex" >
form表单域
- 通过form表单域,收集用户信息传递给服务器。
- 在HTML中,form标签被用于定义表单域,以实现用户信息的收集和传递,form表单中的所有内容都会被提交给服务器。
语法:
<form action = "url地址" method = "提交方式" name = "表单名称">
各种表单控件
</form>
常用属性:
属性 | 属性值 | 作用 |
---|---|---|
action | url地址 | 用于指定接收并处理表单数据的服务器程序的url地址 |
method | get/post | 用于设置表单数据的提交方式,其取值为get或post |
name | 名称 | 用于指定表单的名称,以区分同一个页面中的多个表单 |
文档查阅:
W3C:http://www.w3school.com.cn/
MDN:https://developer.mozilla.org/zh-CN/