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: ...
随机推荐
- 二、为什么要选用pytest以及 pytest与unittest比较
为什么要选择pytest,我看中的如下: 写case,不需要像unittest那样,创建测试类,继承unittest.TestCase pytest中的fixture(类似于setUp.tearDow ...
- (C/C++) 基本排序法
C++ Class 宣告 class Sort{ private: void Merge(int *arr, int front, int mid, int end); int Partition(i ...
- Sql server inner join......on
--查询的时候,如果表中有重名的列,此时,应该在通过 表名.列名 的方式来限定指定的列是哪张表中的.select PhoneNum.pid, PhoneNum.pname, PhoneNum.pcel ...
- [USACO06DEC]牛的野餐Cow Picnic DFS
题目描述 The cows are having a picnic! Each of Farmer John's K (1 ≤ K ≤ 100) cows is grazing in one of N ...
- 静态区间第K小(整体二分、主席树)
题目链接 题解 主席树入门题 但是这里给出整体二分解法 整体二分顾名思义是把所有操作放在一起二分 想想,如果求\([1-n]\)的第\(k\)小怎么二分求得? 我们可以二分答案\(k\), \(O(n ...
- DropDownList绑定及修改
DropDownList绑定及修改 http://www.cnblogs.com/hulang/archive/2010/12/29/1920662.html ? 1 2 3 4 5 6 7 8 ...
- mock static方法
<dependency> <groupId>org.powermock</groupId> <artifactId>powermock-api-mock ...
- AES/ECB/NoPadding 加减密
package unit; import javax.crypto.Cipher; import javax.crypto.spec.SecretKeySpec; import org.apache. ...
- jQuery常用的方法
each() 以每一个匹配的元素作为上下文来执行一个函数. size() jQuery 对象中元素的个数.
- python 文件处理(基础字符)
基于字符read & write 最基本的文件操作当然就是在文件中读写数据.这也是很容易掌握的.现在打开一个文件以进行写操作: 1. fileHandle = open ( 'test.txt ...