HTML第三章总结

文章介绍了HTML5中表单的创建和使用,包括<form>标签,POST和GET提交方法的安全性差异。详细讨论了<input>标签的各种类型,如text、password、radio、checkbox等,以及<select>列表框、<textarea>多行文本域的使用。此外,还提到了表单验证功能,如placeholder和required属性。
摘要由CSDN通过智能技术生成

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属性:用来校验输入内容是否匹配
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值