专注前端行业精选
表单高级 - 表单组成、表单域、表单控件、提示信息、表单字段/标题、上传文件、隐藏字段、图像域
作者:鹏仔先生日期:2020-06-02 14:59:36浏览:2619分类:HTML
表单高级
表单的组成:表单域、表单控件、提示信息
1.表单域
<form method="get | post" action="服务器地址"></form>
2.表单控件
① 文本框
<input type="text"/>
② 密码框
<input type="password" placeholder="请输入密码"/>
③ 提交按钮
<input type="submit" value="立即注册"/>
④ 重置按钮
<input type="reset"/>
⑤ 单选按钮
<input type="radio" name="h"/>
⑥ 复选按钮
<input type="checkbox" checked/>
⑦ 普通按钮(disabled是禁用状态)
<input type="button" disabled value="立即领取"/>
3.提示信息
写在表单控件前后的文本内容
我们常把提示信息放在一个label标签中
语法:
<label></label>
① 将单选或复选按钮的提示信息放在label标签中,可以达到点击文字选中按钮的效果,用法如下:
<input type="radio" name="sex" id="box"/><label for="box">男</label>
② 利用label标签可以实现表单内容的对齐效果
③ label是一个内联元素
4.表单字段集字段集标题
语法:
<fieldset> <legend></legend> </fieldset>
作用:将form中的多个表单控件进行分组
5.上传文件
语法:
<input type="file"/>
6.隐藏字段
语法:
<input type="hidden"/>
注:该标签主要用在后端进行数据的增删查改
7.图像域
语法:
<input type="image" width="数值" height="数值" src="图片路径"/>
注:使用图像域作为提交按钮,同样具备提交功能
猜你还喜欢
- 10-08 vue按钮限制连点封装 自定义指令限制连点
- 12-28 PHP的语法
- 09-14 nvm常用命令有哪些?nvm如何切换node版本?nvm如何下载node?
- 08-19 使用HBuilderX将vue或H5项目打包app
- 07-15 小程序嵌入网页向小程序跳转并传参,微信小程序中实现公众号授权获取openId
- 10-25 js替换字符串某个字符,js修改字符串中指定字符
- 10-20 uniapp中text-indent不起作用,uniapp首行缩进不管用如何解决?
- 08-12 elemtnui 表格如何修改某行文字颜色
- 08-03 vue中调用百度地图 获取经纬度
- 07-09 uniapp小程序实现录音 uniapp小程序长按录音 点击播放等功能(CSS实现语音音阶动画效果)
- 04-30 object-fit:cover;在小程序中不起作用,小程序图片变形了如何处理
- 04-26 (安卓/IOS)APP调用H5事件,H5调用APP事件
取消回复欢迎 你 发表评论:
- 搜索
- 随机tag
暂无评论,来添加一个吧。