1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>HTML5</title>
  6. </head>
  7. <body>
  8. 在android和ios中尤其能体现这些输入控件的特点,会自动切换到不同的虚拟键盘!
  9. <hr>
  10. <form>
  11. 查询文本框
  12. <input type="search" placeholder="请输入查询关键字" autofocus>
  13. <hr>
  14. 列表提示
  15. <input type="text" list="searchlist">
  16. <datalist id="searchlist">
  17. <option value="beijing" label="北京" />
  18. <option value="shanghai" label="上海" />
  19. <option value="nanjing" label="南京" />
  20. <option value="nanchang" label="南昌"/>
  21. </datalist>
  22. <hr>
  23. 数字文本框
  24. <input type="number" max="9" min="0" step="1"/>
  25. <hr>
  26. 滑动条
  27. <input type="range" max="9" min="0" step="1" value="2">
  28. <hr>
  29. 颜色文本框
  30. <input type="color" value="#ff00ff"/>
  31. <hr>
  32. 电话文本框
  33. <input type="tel">
  34. <hr>
  35. 网址输入
  36. <input type="url">
  37. <hr>
  38. 邮箱地址
  39. <input type="email">
  40. <hr>
  41. 日期选择
  42. <input type="date" max="2012-10-10" min="2001-01-01" value="2011-01-01" />
  43. <hr>
  44. 时间选择
  45. <input type="time" max="18:39:57" min="17:49:57" value="17:49:58" />
  46. <hr>
  47. UTC日期时间
  48. <input type="datetime" />
  49. <hr>
  50. 本地日期时间
  51. <input type="datetime-local" />
  52. <hr/>
  53. <input type="submit" value="submit"/>
  54. <p>H5中新增的input元素只有在点击提交按钮时,才有效果</p>
  55. </form>
  56. </body>
  57. </html>

  

08 H5新增input元素的更多相关文章

  1. H5新增input表单、表单属性

    新增表单 email,Email类型 url , Url类型 date,日期类型 time,时间类型 month,月类型 week,周类型 number,数字类型 tel,电话类型 search,搜索 ...

  2. H5新增input标签

    1.电子邮件 <input type="email" name="email"/> 默认正则:输入内容必须有@符号,@后面必须有内容 2.搜索框 & ...

  3. H5新增元素

    标签 标记意义及用法分析/示例 属性/属性值/描述 <article> 定义独立的内容,如论坛帖子.报纸文章.博客条目.用户评论等内容. 支持HTML5的全局属性和事件属性. <as ...

  4. 笔记:HTML5中input元素新增的type值

    在HTML5中,input元素的type值增加了不少,使input的功能强大了很多. 但在各大浏览器中并不是所有的type值都支持. 以下是比较有用.并且浏览器支持的稍好一些的值: type=colo ...

  5. HTML(七)HTML 表单(form元素介绍,input元素的常用type类型,input元素的常用属性)

    前言 表单是网页与用户的交互工具,由一个<form>元素作为容器构成,封装其他任何数量的表单控件,还有其他任何<body>元素里可用的标签 表单能够包含<input> ...

  6. HTML5之新增的元素和废除的元素 (声明:内容节选自《HTML 5从入门到精通》)

    新增结构元素: section元素 section元素定义文档或应用程序中的一个区段,比如章节.页眉.页脚或文档中的其他部分.它可以与h1,h2,h3,h4,h5,h6元素结合起来使用,标示文档结构. ...

  7. HTML5增加与改良的input元素

    h5中form表单中input新增的属性值 在HTML5中增加了许多新的标签和功能属性,今天我们来看一个Form表单在HTML5中新的使用方法.那么在HTML5中新加入的这个功能与之前咱们使用的功能区 ...

  8. H5新增特性

    1.pattern:写正则,但是需要和form表单连着用 2.WebSocket "网络套接字", 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议.在 W ...

  9. H5新增的标签和属性

    声明 Web 世界中存在许多不同的文档.只有了解文档的类型,浏览器才能正确地显示文档. HTML 也有多个不同的版本,只有完全明白页面中使用的确切 HTML 版本,浏览器才能完全正确地显示出 HTML ...

随机推荐

  1. cocos2dx 制作单机麻将(五)

    cocos2dx 制作单机麻将(五) 麻将逻辑6 最基础的4人麻将逻辑(轮流循环出牌, 之前学的都能用上  跑起来了!!!) 最基础的麻将逻辑 依据自己须要 设置麻将人数GAME_PLAYER 基本流 ...

  2. 使用RNN解决句子对匹配问题的常见网络结构

    /* 版权声明:能够随意转载,转载时请标明文章原始出处和作者信息 .*/ author: 张俊林 除了序列标注问题外,句子对匹配(Sentence Pair Matching)问题也是NLP中非经常见 ...

  3. OpenGL的版本号历史和发展

    来源请注明.本文永久地址为http://www.cnblogs.com/vertexshader/articles/2917540.html OpenGL®作为业界最为广泛使用的2D和3D图形接口标准 ...

  4. web框架和Django框架的初识

    1,web框架的原理 1.1>c/s架构和b/s架构 1>c/s客户端模式 2>B/S浏览器模式-----web开发(web开发开的是B/S架构) 1.2>web开发的本质 1 ...

  5. make运行阶段划分

    1 make执行分为两个阶段 第一个阶段:读makefile并且建树阶段 第二个阶段:构建目标阶段 2 扩展的立即和推迟 在第一个阶段的扩展是立即,在第二个阶段或者在需要的时候再扩展是推迟,这里的需要 ...

  6. IDEA及时更新js代码

    需要在Tomcat的设置中为: on ‘update‘ action:当用户主动执行更新的时候更新 快捷键:Ctrl + F9 on frame deactication:在编辑窗口失去焦点的时候更新 ...

  7. 【Selenium】软件测试基础(软件测试分类和工具组)firebug、firepath的安装

    白盒测试:需要了解内部结构和代码 黑盒测试:不关心内部结构和代码 灰盒测试:介于白盒黑盒之间 静态测试:测试时不执行被测试软件 动态测试:测试时执行被测试软件 单元测试:测试软件的单元模块 集成测试: ...

  8. 运算符:三目运算符,运算符优先级,sizeof,自增自减,取余

    一://---------运算符-----------// 1.运算符是告诉编译程序执行特定算术或逻辑操作的符号. 2.按照功能划分: 算术运算符. 关系运算符与逻辑运算符.按位运算符. 3.运算符根 ...

  9. 洛谷 P2444 [ POI 2000 ] 病毒 —— AC自动机+dfs

    题目:https://www.luogu.org/problemnew/show/P2444 AC自动机上 dfs,不走结尾点,如果走出环就是有无限长度的串: RE无数,原来是数组开成 2000 的了 ...

  10. eoj 3507 坑爹的售票机

    EOJ 3507 坑爹的售票机   问题描述 oxx 和 xjj 决定和小伙伴们一同坐船前往 Xiamen.去 Xiamen 的船票一张 p 元. 当他们满怀兴致地来到港口时发现居然只有不设找零的自动 ...