html5 填表 表单 form label input button legend fieldset

<form>本身没有什么意义, 但是某些依赖form的标签元素一旦没有了form就不能生效. 所以form是提供一个定义环境给form的插件元素去生效的.


1.method 属性post一般用表单提交, 而get 一般用超链接提交. 如果用post提交百度就会出错.或者返回的链接不会带有?user=
<form
method="post" action="http://www.baidu.com">
<input
name="usr">
<button>提交</button>
</form>

2.enctype 一般用multipart/form-data
3.autocomplete on/off 下拉提示,与点击自动完成
4.novalidate
<input> 提供输入的文本框

name 属性规定 input 元素的名称。
name 属性用于对提交到服务器后的表单数据进行标识,或者在客户端通过 JavaScript 引用表单数据。
value 哪怕打字, 本来也会出现的文本信息. 比如
搜索栏里面默认value是"王宝强离婚" 那用户就省去输入的时间.
form 配合id使用,可以从外挂钩到表单内部. 用于一个数据挂钩多个表单.
type 限制输入内容,比如数字的只能输入数字, 输入法读取到input的type后会自动弹出相应的触摸键盘, 传送门

<lable> lable可以利用css化妆
for 属性 输出label化妆效果到指定标签id. for 可以同时化妆多个区域标签.

如果label 不使用 for 什么id 去化妆指定区域, 那还有一种方法就是把指定区域,用label 括起来
<label>
<input…>…
</label>
for 和from的区别, from 是引用提取数据"凹"进去等待填充, 而for是输出数据 "凸"出来就绪服务输出, 好邪恶……

<fieldset> 可以做整体的化妆, 整体的禁用, 还有一个明显的框表示.

<legend> 分组标签

<button> 提交表单或者链接

type:
submit 提交
reset 重置 input的 value是空, 否则就是value对应的文本
button 配合js 触发特定事件
button的其他属性:


form 包括button, 但 button 如果有特殊设置, 就以button的属性为优先处理.忽略form的冲突项.
html5 填表 表单 form label input button legend fieldset的更多相关文章
- 前端与后台可能需要使用交互的表单form,input标签
前端与后台可能需要使用交互的表单标签 form表单和input标签 textarea文本域表单 select,option下拉列表表单 fieldset和legend组合表单 label标签 form ...
- html5,表单与label标签配套使用
<form action=""><input type="checkbox" name="dx" value=" ...
- Html5 填表 表单(二) input type 各种输入, 各种用户选择,上传等等泛输入用户交互
<input> 无限制输入 type 限制输入 type = 如下类型 type 后还可以跟一些属性: 如<input type=text max ...
- html5 填表 表单 input output 与表单验证
1.<output> Js计算结果 <form oninput="res.value = num1.valueAsNumber*num2.valueAsNumber ...
- html5,表单与label标签的用法2
<form action="" autocomplete="on"> <input type="submit" va ...
- HTML:form表单总结,input,select,option,textarea,label
<form>标签是块级元素. form标签的标准属性有id,class,style,title,lang,xml:lang. 表单能够包含input元素(包含button,checkbox ...
- HTML(七)HTML 表单(form元素介绍,input元素的常用type类型,input元素的常用属性)
前言 表单是网页与用户的交互工具,由一个<form>元素作为容器构成,封装其他任何数量的表单控件,还有其他任何<body>元素里可用的标签 表单能够包含<input> ...
- HTML学习笔记 域元素(form表单、textarea文本域、fieldset域集合、input使用) 案例 第四节 (原创)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- HTML5的表单input元素的新属性
知识点 <HTML5的表单input元素的新属性>,留待学习分享... <!-- HTML5的表单input元素的新属性 Autocomplete:自动完成功能 Autofocus: ...
随机推荐
- 微信小程序获取用户手机号,服务器解码demo
原理:通过微信登陆接口wx.login得到encryptedData . iv .code.经过接口处理code得到sessionkey.最后官方demo得到解密后的手机号.(接口处理这一步也可以在 ...
- 关于Execel 2007 连接到 hive odbc
官方给出的都是 2010 或2012版的连接方案,看起来与2007有些不同,但我相信这些功能都是通用的. 下载 odbc hive 驱动.http://hortonworks.com/products ...
- 洛谷 P2286 [HNOI2004]宠物收养场
题目描述 凡凡开了一间宠物收养场.收养场提供两种服务:收养被主人遗弃的宠物和让新的主人领养这些宠物. 每个领养者都希望领养到自己满意的宠物,凡凡根据领养者的要求通过他自己发明的一个特殊的公式,得出该领 ...
- Image组件
/* Image* 用于显示图片的组件,包括网络图片,静态资源 * 常用性能: * resizeMode 图片适应模式 cover , contain , stretch * source 图片的引用 ...
- feign调用过程注意事项
Feign是Netflix开发的声明式.模板化的HTTP客户端, Feign可以帮助我们更快捷.优雅地调用HTTP API. 在Spring Cloud中,使用Feign非常简单——创建一个接口,并在 ...
- python学习之路---day07
一:先看什么事赋值? 以例子举例说明:. a=[1,2,3,[11,22,33]] b=a print(b) -->b=[1,2,3,[11,22,33]] 01):赋值 浅拷贝:我们创建a时, ...
- Nginx负载均衡详解
upstream mysvr { server 192.168.10.121:3333; server 192.168.10.122:3333; } server { .... location ...
- C++_标准模板库STL概念介绍2-泛型编程
有了之前使用STL的经验后,接下来讨论泛型编程及其底层的理念: 首先我们知道STL只是泛型编程的一种: 而面向对象的编程方式关注的是编程的数据方面: 而泛型编程关注的是算法: 但是,他们之间的一个重要 ...
- BZOJ 2935/ Poi 1999 原始生物
[bzoj2935][Poi1999]原始生物 2935: [Poi1999]原始生物 Time Limit: 3 Sec Memory Limit: 128 MBSubmit: 145 So ...
- 江西理工大学南昌校区排名赛 E: 单身狗的种树游戏
题目描述 萌樱花是一只单身狗. 萌樱花今天决定种树,于是他来到了自己家的后院. 萌樱花的后院有n个树坑,所有树坑排列在一行上,每一个树坑都可以种一棵树,相邻树坑间的距离为1,现在所有的树坑都是空着的. ...