HTML第三章总结
1.表单
- 表单在网页中随处可见,比如登录页面中的用户名、密码、验证码、提交按钮
由一些常用的小组件组成,文本框,密码框等
语法:
- 表单在HTML5中,使用<from>标签用于创建表单,以实现用户信息的收集和传递
- <from action>=“表单提交地址” method="表单提交方式”
- 而提交方法有两种:post方法和get方法
- post和get区别
post:不改变浏览器地址,安全性高于get,用于保存,修改删除
get:表单信息会显示在地址栏中,安全性低,用于查询数据信息
2.input标签
语法:
<input> type=“组件类型” name=“名称” size=“宽度” maxlength=“最大输入” checked>
<type>类型
- text:普通的文本输入框
- password:密码框,输入的内容被隐藏
- radio:单选按钮,name必须为一组,使用checked默认选中
- checkbox:复选框,可以选中多个目标
- button:普通按钮
- submit:提交按钮,将数据发送到服务器
- reset:表单重置按钮,清空from中的数据
- file:文件上传按钮
- email:邮箱输入框,会自动校验输入的内容是否为邮箱格式
- url:网络输入框,会校验内容是否为网址
- number:数字输入框
- range:滑块,滑动选择数值,用min和max设定数值范围,step设定数字间隔
- search:搜索框,可以清空输入
3.列表框
<select name=“名称”> 定义一个下拉多行列表
<option value=“可选项的值”selected=“selected”>选项显示的内容</option>
<option value=“可选项的值”>选项的显示内容</option>
selected属性在默认情况下被选中的
4.多行文本域
<textarea name=“textarea” aols=“显示的宽度” rows=“显示的行数”>
文本内容
<textarea>
与iuput不同,textarea没有valaer属性,直接写在标签里
5.高级应用
- 隐藏域:隐藏域在页面中用户是不可见的,用于隐藏用户信息
<input type=“hidden”>
- 只读禁用:数据不可修改,灰色的按钮不可以单击。
只读(readonly)属性 ,禁用(disabled)属性
列表框的默认选中,可以写为selected
6.表单的标注
对鼠标进行标注,则可以不用直接选中单选按钮,反而可以单击文本,其对应的按钮会自动选中
7.表单验证
- placeholder属性:属于input类型文本框提供的提示,文本框为空时,出现提示。文本框输入内容时,提示语消失。
placeholder=“提示语”
- required属性:用于规定输入框不能为空,否则不能提交表单
- pattern属性:用来校验输入内容是否匹配