HTML5中form的新增属性或元素

1.新增的表单元素

1.1 progress
表示任务的完成情况,常用于进度条。

  • max 定义进度元素所要求的任务的工作量,默认值为1
  • value 定义已经完成的工作量,如果max值为1,该值必须是介于0~1之间的小数。
<progress value="70",max="100">70%</progress>

1.2 output
表示用户动作产生的结果.

name 定义元素的名称 for 其他元素的id列表,表明这些元素为计算提供了输入值(或其他影响)。

1.3 meter
刻度条,表示规定范围内的数量值。

  1. value:在元素中特地表示出来的实际值,该值在min与max之间,如果未指定,该值默认为1
  2. min :指定规定范围时允许使用的最小值,默认为0 max :指定规定范围时允许使用的最大值,默认为1
  3. low :规定范围的下限值必须小于或等于high属性的值 high:规定范围的上限值(表示较高危险的意思)
  4. optimum :最佳值
<p>He got a <meter low="69" high="80" max="100" value="84">B</meter> on the exam.</p>

1.4 datalist

下拉列表,表示其他控件可用的值,其值通过<option>作为datalist的子元素存在
![图片描述][3]

2. input的type属性值
在H5中,对input的type进行了扩展,可以有更多的取值

2.1 search 搜索框
2.2 placeholder 提示输入内容
2.3 日期相关:

date 日期控件(年,月,日,不包含时间);
time 时间控件;
datatime 日期时间控件;
month 日期插件(年,月);
week 日期插件(年,周)。

2.4 功能相关:

email email控件
url 地址控件
tel 电话控件

3.提交按钮上新增的属性(记忆)
在H5中,可以将表单内的从属元素书写在页面上的任何地方,然后为该元素指定一个form属性,属性值为该表单的id。


           <input type="submit">

3.1 formaction
一般用于提交按钮和图片按钮上,用于指定处理表单提交的后台程序,可以重写form中的action属性。

3.2 formmethod
一般用于提交按钮和图片按钮上,用于指定处理表单的内容类型。

3.3 formenctype
一般用于提交按钮和图片按钮上,用于指定表单的提交方式。

3.4 formtarget
一般用于提交按钮和图片按钮上,用于指定表单提交后在哪里显示响应页面。

原文地址:https://www.cnblogs.com/baimeishaoxia/p/11963659.html

时间: 2024-10-12 19:28:08

HTML5中form的新增属性或元素的相关文章

HTML5的form表单属性

form:HTML4中,表单内的从属元素必须书写在<form></form>之内,但是在HTML5中,表单的从属元素可以处于页面的任何位置,然后为其添加form属性,属性值为form表单的id属性值即可,表单form与从属元素的从属关系依然有效, like this: <form id="log"> <input type="submit"> </form> <input type="sub

HTML5中的&lt;canvas&gt;画布:使用canvas元素在网页上绘制四分之一圆(3)

前几天自己做了个四分之一的圆,放到手机里面测试.效果不是很好.于是今天通过查资料,找到了canvas.自己研究了一天,发现可以使用canvas画圆.代码如下: 1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 7 </head> 8 <body&g

HTML5中的&lt;canvas&gt;画布:使用canvas元素在网页上绘制线条和圆(1)

什么是 Canvas? HTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像. 画布是一个矩形区域,您可以控制其每一像素. canvas 拥有多种绘制路径.矩形.圆形.字符以及添加图像的方法. 创建 Canvas 元素 向 HTML5 页面添加 canvas 元素. 规定元素的 id.宽度和高度: 1 <canvas id="myCanvas" width="200" height="100"></ca

html5中form表单新增属性以及改良的input标签元素的种类

在HTML5中,表单新增了一些属性,input标签也有了更多的type类型,有些实现了js才能实现的特效,但目前有些浏览器不能全部支持.下面是一些h5在表单和input标签上的一些改动. <!DOCTYPE html><html> <head> <title>表单测试</title> <meta charset="utf-8" /> <!-- 在不支持h5的浏览器中,可以用CSS样式进行改写 --> &

HTML5之表单新增属性

之前已经接触过的新增属性:autocomplete.autofocus.list.multiple.placeholder.required.min.max.step from属性:将表单外的内容与表单进行关联 <form action="" id="kc" > <input type="text" name="dd" form="kc" >(不再form表单中) novalidat

HTML及HTML5中好玩的全局属性

全局属性可以应用到所有的HTML标签中,当然以前HTML4有不支持的,当然HTML5中就算你加了全局属性也没发现有个鸟用. 全局属性总共16种,HTML5新增了8种. 原来的属性里class,id,style没什么好玩好说的; 4.accesskey 设置访问元素的快捷键 注意: 在不同操作系统中不同的浏览器中访问快捷键的方式不同 Windows中IE和Chrome是[Alt] + accesskey Firefox是[Alt] [Shift] + accesskey 其他浏览器也不出这几种ct

HTML5时代看css3新增属性

写在前面的话: 由于CSS3标准还未完全订下来,所以各种内核的浏览器都有自己的标准,为了不使属性混淆,所以各家在各家自标准前加了一个前缀, 如:-moz-主要是firefox火狐 -webikt-主要是chrome谷歌 -o-主要是用于苹果浏览器 一.box-shadow(阴影效果) 使用: box-shadow:20px 10px 0 #000: -moz-box-shadow:20px 10px 0 #000: -webkit-box-shadow:20px 10px 0 #000: 支持:

html5表单及新增的改良元素

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <!--表单内元素的form属性:为元素指定一个form属性,属性值为该表单的id--> <form id="testform"> <input type="subm

html5中新的标准属性

属性                                        值                                  描述accesskey                           character                 规定访问元素的键盘快捷键class                                 classname                 规定元素的类名(用于规定样式表中的类).contenteditab