HTML5之表单
在网站中,表单是指收集用户的信息。
一,表单控件
1.文本框:单行文本框(Text input),密码框(PassWord input),文本域(Text area)。
2.选择:单选按钮(Radio buttons),复选按钮(Checkboxes),下拉列表(Drop-downboxes)。
3.提交表单:提交按钮(Submit button),图像按钮(Image buttons)。
4.上传文件:允许用户把文件上传到网站。
二,表单结构
1.<form>:表单控件位于<form>元素中。
2.action:用于指向服务器上一个页面的URL。
3.method:表单的提交方法之一:get或post。
三,单行文本框、
1.<input>:用来创建不同的表单控件。
2.type="text":创建一个单行文本框。
3.name:这个特性的值对应表单控件。
4.maxlength:限制用户在文本框输入的最大字符量。
四,密码框
1.<input>:上面我们提到了这是用来创建不同的表单控件。
2.type="password",,这里也会创建一个文本框,不同的是,输入的字符将会被隐藏。
3.name:与上同理。
4.maxlength:同样是限制用户输入的最大字符量。
五,多行文本框
1.<textarea>:用来创建多行文本框。
六,单选按钮
1.<input>:自行脑补上面的内容哈。
2.name:一个系列的单选按钮应该用同样的name。
3.value:每一个的单选按钮的value都应该不同。
4.checked:就是网页在加载后显示那个按钮被选中,用户不能更改。
七,复选框
1.type="checbox":允许用户选中多个或取消。
2.name:同上原理。
3.value:同理哈,要认真看。
4.checked:同理哈。
八,下拉列表框
1.<select>:用来创建下拉列表框。
2.name:指明表单控件的名称。
3.<option>:用来指定用户可以选择的选项,注意:每个选项都应该有<option>。
4.value:指定选项的值。
5.selected:指定页面在加载时被选中的选项,注意:只能选一个选项。
九,多选框
1.<select>:用来创建多选框。
2.size:size的值是一次显示的选项的数量。
3.multiple:允许用户选多项。
十,文件上传域
1.<input>
2.type="file":会创建一个带有browse按钮的控件。
十 一,提交按钮
1.<input>
2.type="submit":创建一个提交按钮。
3.value:用来控制按钮上的文字。
十二,图像按钮
1.<input>
2.type="image":用来创建一个图像按钮。
3.要用到图像,必少不了src。
4.width height:控制图像的宽度和高度。
十三,按钮和隐藏控件
1.<button>创建按钮。
2.<input type="hidden">:隐藏表单控件,不会显示在用户的页面上。
十四,标签表单控件
1.<label>:在表单控件旁边使用它,可以说明白表单控件的作用。
2.for:它用来表明标签控件是对应哪个表单控件的。
十五,组合表单元素
1.<fieldset>:可将相关表单控件置于一组。
2.<legend>:包含一个标题。
十六,日期控件
1.<input type="data">:将创建一个日期控件,要求用户输入日期。
十七,电子邮件控件
1.<input type="email">:将创建一个电子邮件控件,用户必须输入正确的邮箱地址。
十八,URL输入控件
1.<input type="url">:将创建一个URL控件,用户必须输入正确的URL地址。
十九,搜索输入控件
1.<input type="search">:将创建一个搜索输入控件。
2.placeholder:文本框显示的内容,占位。
OK,表单的知识点很多,要认真学,记得不懂就提问或者搜索。