HTML5 中的新属性。

 
属性 描述
accept mime_type 规定通过文件上传来提交的文件的类型。
align
  • left
  • right
  • top
  • middle
  • bottom
不赞成使用。规定图像输入的对齐方式。
alt text 定义图像输入的替代文本。
autocomplete
  • on
  • off
规定是否使用输入字段的自动完成功能。
autofocus autofocus

规定输入字段在页面加载时是否获得焦点。

(不适用于 type="hidden")

checked checked 规定此 input 元素首次加载时应当被选中。
disabled disabled 当 input 元素加载时禁用此元素。
form formname 规定输入字段所属的一个或多个表单。
formaction URL

覆盖表单的 action 属性。

(适用于 type="submit" 和 type="image")

formenctype 见注释

覆盖表单的 enctype 属性。

(适用于 type="submit" 和 type="image")

formmethod
  • get
  • post

覆盖表单的 method 属性。

(适用于 type="submit" 和 type="image")

formnovalidate formnovalidate

覆盖表单的 novalidate 属性。

如果使用该属性,则提交表单时不进行验证。

formtarget
  • _blank
  • _self
  • _parent
  • _top
  • framename

覆盖表单的 target 属性。

(适用于 type="submit" 和 type="image")

height
  • pixels
  • %
定义 input 字段的高度。(适用于 type="image")
list datalist-id 引用包含输入字段的预定义选项的 datalist 。
max
  • number
  • date

规定输入字段的最大值。

请与 "min" 属性配合使用,来创建合法值的范围。

maxlength number 规定输入字段中的字符的最大长度。
min
  • number
  • date

规定输入字段的最小值。

请与 "max" 属性配合使用,来创建合法值的范围。

multiple multiple 如果使用该属性,则允许一个以上的值。
name field_name 定义 input 元素的名称。
pattern regexp_pattern

规定输入字段的值的模式或格式。

例如 pattern="[0-9]" 表示输入值必须是 0 与 9 之间的数字。

placeholder text 规定帮助用户填写输入字段的提示。
readonly readonly 规定输入字段为只读。
required required 指示输入字段的值是必需的。
size number_of_char 定义输入字段的宽度。
src URL 定义以提交按钮形式显示的图像的 URL。
step number 规定输入字的的合法数字间隔。
type
  • button
  • checkbox
  • file
  • hidden
  • image
  • password
  • radio
  • reset
  • submit
  • text
规定 input 元素的类型。
value value 规定 input 元素的值。
width
  • pixels
  • %
定义 input 字段的宽度。(适用于 type="image")

新增的type类型:

HTML5中,除了一般的text,button等一些基本的input类型之外,还增加了新的Input类型,拥有多个新的表单输入类型,可以达到更好的控制和验证。

  • 网址:<input type="url" name="url"/><br/>
  • 邮箱:<input type="email" name="email"/><br/>
  • 年月日的日期空间:<input type="date" name="date"/><br/>
  • 时分:<input type="time" name="time"/><br/>
  • 年月日时分:<input type="datetime-local"/><br/>
  • 年月: <input type="month" name="month"/><br/>
  • 周: <input type="week" name="week"/><br/>
  • 数字: <input type="number" name="number"/><br/>
  • 颜色: <input type="color" name="color"/><br/>
  • 区域: <input type="range" name="range"/><br/>
    
  • 搜索:<input type="search" name="search"/><br/>
 
  • pattern 为正则验证属性
  • title 为提醒:
  • min:为最小数字
  • max:为最大数字
  • step:为输入数字合法间隔,默认为1
 
datalist标签:
散焦时:
聚焦时:
 
 

<input> 标签的更多相关文章

  1. embed标签loop=true背景音乐无法循环

    在html网页中加入背景音乐并设置为循环播放.一开始用<embed>标签,设置loop="true", 但是结果发现在IE浏览器可以,但是在chrome浏览器却无法实现 ...

  2. 【转】object标签和embed标签

    我们现在大部分人做网页,都是直接用DW插入flash,而且DW也是所见即所得,直接生成了相应的flash显示代码.可是我们又有多少人了解这些直接由DW生成的代码呢?其实我接触flash player标 ...

  3. embed标签的使用(在网页中播放各种音频视频的插件的使用)

    播放器插件使用说明: 代码:< EMBED src=“music.mid”autostart=“true”loop=“2”width=“80”height=“30”> src:音乐文件的路 ...

  4. as3.0 [Embed]标签嵌入外部资源

    1.[Embed]嵌入资源 ActionScript代码的顺序非常重要.你必须在声明变量前添加[Embed]元数据标签,而且这个变量的类型会是Class; package { import flash ...

  5. 解决embed标签显示在div上层【转藏】

    解决embed标签显示在div上层,非设置z-index 今天给屌炸了爆笑网增加了视频栏目,但是发现在IE8中,顶部浮动导航的div在移动到embed视频上时,总是被embed的flash文件盖住.分 ...

  6. OBJECT和EMBED标签(转载)

    一.介绍: 我们要在网页中正常显示flash内容,那么页面中必须要有指定flash路径的标 签.也就是OBJECT和EMBED标签.OBJECT标签是用于windows平台的IE浏览器的,而EMBED ...

  7. 转: object 和embed 标签播放flash

    一.介绍: 我们要在网页中正常显示flash内容,那么页面中必须要有指定flash路径的标 签.也就是OBJECT和 EMBED标签.OBJECT标签是用于windows平台的IE浏览器的,而EMBE ...

  8. OBJECT和EMBED标签

    一.介绍: 我们要在网页中正常显示flash内容,那么页面中必须要有指定flash路径的标 签.也就是OBJECT和EMBED标签.OBJECT标签是用于windows平台的IE浏览器的,而EMBED ...

  9. HTML 5 <embed> 标签

    定义和用法 <embed> 标签定义嵌入的内容,比如插件. 实例 <embed src="helloworld.swf" />

  10. chrome不支持embed标签解决方案

    <!DOCTYPE html> <html> <head> <title></title> <meta http-equiv=&quo ...

随机推荐

  1. ora-01589

    今天遇到了ORA-01589这个错误,下面把解决方案记录如下: SQL*Plus: Release 9.2.0.1.0 - Production on 星期四 4月 17 15:01:26 2008C ...

  2. C#调用C++函数入口点的问题 z

    C++使用 void extern __declspec(dllexport) 函数名()定义的输出函数, 在C#中调用时, 如前文所述, 使用 [DllImport("D:\VS2005P ...

  3. Oracle将英文字符集数据转换成中文

    转换背景:老系统数据为英文字符集,需要将老数据(Oracle 8i)转换到oracle 10g(中文字符集)中 思路:先将老数据从8i的数据库中导出,导出的数据库文件为英文字符集,再将10g的数据库改 ...

  4. 常用的MAVEN公共私服

    flex-mojo http://repository.sonatype.org/content/groups/flexgroup flex相关 http://nexus.5amsolutions.c ...

  5. bzoj 1483 [HNOI2009]梦幻布丁(链表+启发式合并)

    1483: [HNOI2009]梦幻布丁 Time Limit: 10 Sec  Memory Limit: 64 MBSubmit: 1818  Solved: 761[Submit][Status ...

  6. NOIP2001 统计单词个数

    题三 统计单词个数(30分) 问题描述 给出一个长度不超过200的由小写英文字母组成的字母串(约定;该字串以每行20个字母的方式输入,且保证每行一定为20个).要求将此字母串分成k份(1<k&l ...

  7. java 小结2 多态问题和容器介绍

    面向对象这个东西,其实我们一直是不是都没有感觉到自己在用,以后我一定要用用.以前学c#时候认真的看过一次,最近一直研究java.随便再看看. 多态问题: 在java中多态分为(1)编译时多态和(2)运 ...

  8. Linear Regreesion

       3.似然函数:我是这么理解的,比如说我们知道某个X的概率分布密度函数,但是这个概率分布有未知的参数,但是我想得到这个未知的参数θ,然后我们就通过很多个已知的变量,把这些概率分布密度函数乘起来,这 ...

  9. POJ-3207 Ikki's Story IV - Panda's Trick 2sat

    题目链接:http://poj.org/problem?id=3207 题意:在一个圆圈上有n个点,现在用线把点两两连接起来,线只能在圈外或者圈内,现给出m个限制,第 i 个点和第 j 个点必须链接在 ...

  10. storm-starter项目概述

    storm-starter项目包含使用storm的各种各样的例子.项目托管在GitHub上面,其网址为: http://github.com/nathanmarz/storm-starter stor ...