这里我们创建一个填写个人基本信息的表单，使用了表单元素有<input>输入框、<datalist>选项列表、<textarea>文本框，通用的表单输入类型有text、password、file、radio、checkbox、email、url、number、Date pickers。并为表单及表单元素设定了相应的属性。代码如下：

运行这段代码，表单在页面中的展示如图1所示：

图1  HTML5综合表单

IT兄弟连 HTML5教程 HTML5表单 H5表单提交综合实例的更多相关文章

  1. IT兄弟连 HTML5教程 HTML5表单 小结及习题

    小结 HTML表单提交的方法有get方法和post方法,get方法的作用是从指定的资源请求数据,post方法的作用是向指定的资源提交要被处理的数据.HTML表单一直都是Web的核心技术之一,有了它我们 ...

  2. IT兄弟连 HTML5教程 HTML5表单 新增的表单属性1

    HTML5 Input表单为<form>和<input>标签添加了几个新属性,属性如表1. 1  autocomplete属性 autocomplete属性规定form或inp ...

  3. IT兄弟连 HTML5教程 HTML5表单 多样的输入类型1

    HTML5拥有多个新的表单输入类型,这些新特性提供了更好的输入控制和验证.并不是所有的主浏览器都支持新的input类型,不过我们可以在所有的主浏览器中使用它们,即使不被支持,仍然可以显示为常规的文本域 ...

  4. IT兄弟连 HTML5教程 HTML5表单 HTML表单中的get和post方法

    指引 表单在网页应用中十分重要,基本上任何一个网站都必须使用到表单元素,所以表单的美观和易于交互对于网站设计就变得十分重要.HTML5对目前Web表单进行了全面提升,使得我们使用表单更加智能.它在保持 ...

  5. IT兄弟连 HTML5教程 HTML5表单 HTML表单设计2

    5  隐藏域 隐藏域不会在表单中显示.如果需要在页面之间传递重要数据,则在<input>标签中设置type属性值为“hidden”建立一个隐藏域.name和value属性是必需的,用来表示 ...

  6. IT兄弟连 HTML5教程 HTML5表单 HTML表单设计1

    表单是PHP程序中最常使用的收集站点访问者信息的数据输入界面.通过表单浏览器获取用户的输入数据,并传送给Web服务器的脚本程序中,以各种不同的方式进行处理.在表单中提供了多种输入方式,包括文本输入域. ...

  7. IT兄弟连 HTML5教程 HTML5的基本语法 了解Web

    HTML也是计算机编程语言,但由于功能简单易用,不涉及业务逻辑,算是编程语言中最简单的了.其实学习HTML这门语言,就是在学习一个个HTML标记的使用,标记的名称和使用不是自定义的,它的功能及用法是已 ...

  8. IT兄弟连 HTML5教程 HTML5文字版面和编辑标签 使用HTML表格

    表格在网站中应用得非常广泛,使用它可以方便.灵活地排版,很多动态大型网站也都是借助表格排版的,但现在都使用DIV+CSS进行页面布局.表格可以把相互关联的信息元素集中定位,使浏览页面的人一目了然.在H ...

  9. IT兄弟连 HTML5教程 HTML5表单 HTML5新增表单元素

    HTML5有一些新的表单元素:<datalist>.<keygen>.<output>.不是所有的浏览器都支持HTML5新的表单元素,但即使浏览器不支持该表单属性, ...

随机推荐

  1. 大数据学习笔记——Hadoop编程实战之Mapreduce

    Hadoop编程实战——Mapreduce基本功能实现 此篇博客承接上一篇总结的HDFS编程实战,将会详细地对mapreduce的各种数据分析功能进行一个整理,由于实际工作中并不会过多地涉及原理,因此 ...

  2. Vue中无法检测到数组的变动

    本周在写项目中遇到修改数组中的值时,视图无变化问题.在查阅Vue官方文档后了解到,由于由JavaScript 的限制,Vue 不能检测以下数组的变动: 当利用索引直接设置一个数组项时,例如:vm.it ...

  3. for-in的缺点

    for-in用来循环对象中的属性,但是通过for-in循环输出的属性名的顺序是不可测的.具体来说,所有属性都会被返回一次,但返回的先后次序可能会因浏览器而异. ES5之前:如果表示要迭代的对象的变量值 ...

  4. 十年Java程序员-带你走进Java虚拟机-类加载机制

    类的生命周期 1.加载 将.class文件从磁盘读到内存 2.连接 2.1 验证 验证字节码文件的正确性 2.2 准备 给类的静态变量分配内存,并赋予默认值 2.3 解析 类装载器装入类所引用的其它所 ...

  5. 2016/09/29 Maven简介

    1.1 何为Maven Maven这个词可以翻译为"知识的积累",也可以翻译为"专家"或"内行".作为Apache组织中的一个颇为成功的开源 ...

  6. vue 中 px转vw的用法

    下面介绍最简单的用法 1 下载依赖 npm install postcss-import postcss-loader postcss-px-to-viewport --save-dev 2 在项目根 ...

  7. 弹性盒子中的order

    order order 属性 设置或检索弹性盒模型对象的子元素出现的順序.. 注意:如果元素不是弹性盒对象的元素,则 order 属性不起作用. <!DOCTYPE html> <h ...

  8. Nginx核心流程及模块介绍

    Nginx核心流程及模块介绍 1. Nginx简介以及特点 Nginx简介: Nginx (engine x) 是一个高性能的web服务器和反向代理服务器,也是一个IMAP/POP3/SMTP服务器 ...

  9. VS2019 开发Django（二）------hello world!

    导航:VS2019开发Django系列 第一篇介绍了安装Django,那么,今天的主题内容是使用VS编写第一个Django应用. 1)新建Django Web项目 选择新建Django Web项目,在 ...

  10. BOM的补充

    1.首先我们要知道BOM是干什么的? BOM和DOM.ES是JavaScript的重要三个组成部分: Bom的核心操作是window:简单来说就是用来操作浏览器的,他是js访问浏览器的接口,它里面封装 ...