对小白极其友好的HTML表单属性解释

188 阅读2分钟

表单控件常用的必备属性值

<form></form> 定义表单域标签 表单域就是类似于一张表格里面的的所有内容

一、 input 是一个单标签,是一个输入框的意思,里面得有type属性才能生效

type属性的属性值如下

1、 button 定义可点击按钮

2、checkbox 定义多选框

3、file 定义输入字段和浏览按钮,供文件上传

4、hidden 定义隐藏的输入字段

5、image 定义图像形式的提交按钮

6、password 定义密码字段,该字段中的字符被隐藏。

7、radio 定义单选按钮

注意:单选框想多选一,一定要给他们起一个name属性的相同名字

写法: <input type="radio" name="names">可以 <input type="radio" name="names">不可以

** 效果如下: **
image.png

8、reset 重置按钮,清除表单所有数据

9、submit 定义提交按钮,提交按钮会把表单数据发送到服务器

10、text 定义单行输入的字段,默认20个字符

11、email 限制用户输入邮箱

12、type="url" 限制用户输入URL类型 (网站)

13、type="date" 限制用户输入日期 14、type="time" 限制用户输入时间

15、type="month" 限制用户输入为月 16、type="week" 限制用户输入为周

17、type="number" 限制用户输入为数字 18、type="tel" 手机号码

19、type="search" 搜索框 20、type="color" 生成一个颜色表单

二、input的其他属性

name 定义的名字,后台才看得到,写法 name="名字"; value 开发在页面的提示,页面给用户看,并把信息传到后台 写法 value="请输入"; 只显示在文本框里面,后续传给后台

checked 页面一打开就被选中 写法:checked=checked maxlength 规定输入字段最大的字数 写法:maxlength="20"; 写正整数 required=required; 表单拥有该属性的内容不能为空,必填

placeholder=“文本框里提示的字”

autofocus=sutofocus 自动聚焦

autocomplete=off / on (off就是不保存历史记录,on就是保存历史记录)

multiple=multiple ; (可以 多选文件提交)