HTML5中表单的创建
一、常用表单标签如下:
(1)<input>中的“type”属性:
复选框-checkbox;单选按钮-radio;按钮-button;提交-submit;
(2)文本域
行-cols;列-rows;
| <form> | 表单 |
| <input> | 输入域 |
| <textarea> | 文本域 |
| <label> | 控制标签 |
| <fieldset> | 定义域 |
| <legend> | 域的标题 |
| <select> | 选择列表 |
| <optgroup> | 选项组 |
| <option> | 下拉列表中的选项 |
| <button> | 按钮 |
二、常见表单标签的应用
1、输入用户名以及密码表单的制作
(1)主要代码:
<form>
用户名:<input type="text" />
密码:<input type="password" />
<br />
</form>
(2)实现效果:

2、复选框的使用:
(1)主要代码:
<form>
你喜欢的水果有?<br />
苹果<input type="checkbox" />
西红柿<input type="checkbox" />
香蕉<input type="checkbox" />
菠萝<input type="checkbox" />
</form>
(2)实现效果:

3、单选按钮的使用:
(1)主要代码:
<form>
请选择您的性别:
男<input type="radio" name="sex"/>
女<input type="radio" name="sex"/>
</form>
(2)实现效果:

4、下拉列表的使用
(1)主要代码
<form>
<select>
<option>www.baidu.com</option>
<option>www.jikexueyuan.com</option>
<option>www.google.com</option>
</select>
</form>
(2)实现效果

5、按钮的使用
(1)主要代码
<form>
<input type="button" value="按钮" /><br /> //“value”用来定义按钮上面的值
<input type="submit" /> <br />
<input type="reset" /><br /><br /> //”reset“用来重置表单里的内容
</form>
(2)实现效果

6、文本框的使用
(1)主要代码
<textarea cols="10" rows="15">在此输入文字</textarea>
(2)实现效果

HTML5中表单的创建的更多相关文章
- HTML5中表单验证的8种方法(转)
在深人探讨表单验证之前,让我们先思考一下表单验证的真实含义.就其核心而言,表单验证是一套系统,它为终端用户检测无效的控件数据并标记这些错误.换言之,表单验证就是在表单提交服务器前对其进行一系列的检查并 ...
- HTML5中表单验证的8种方法
HTML5中表单验证的8种方法 2012-4-21 11:00| 发布者: benben| 查看: 2765| 评论: 0 摘要: 前一篇,我们介绍了HTML5中新的表单特性和函数, 今天就继续来谈谈 ...
- HTML5中表单元素的formaction属性
在submit按钮中,根据不同的submit按钮,将表单提交到不同的页面中: <form id="test" action="test.jsp"> ...
- HTML5表单及其验证
随笔- 15 文章- 1 评论- 115 HTML5表单及其验证 HTML表单一直都是Web的核心技术之一,有了它我们才能在Web上进行各种各样的应用.HTML5 Forms新增了许多新控件及其A ...
- 利用HTML5与jQuery技术创建一个简单的自动表单完成
来源:GBin1.com 在线演示 在线下载 谷歌快速搜索自带大量自动完成插件——库中甚至还有一个附带的jQuery UI共享选项.然而今天我要寻找一个替代的解决方案.由DevBridge开发的j ...
- HTML5学习总结-05 HTML5表单
一 HTML5 新的类型 HTML5 拥有多个新的表单输入类型.这些新特性提供了更好的输入控制和验证. email url number range Date pickers (date, month ...
- html5表单重写
html5表单重写 一.总结 一句话总结: 表单重写用于在提交按钮上指定表单提交的各种信息,比如action <input type="submit" value=" ...
- HTML5: HTML5 表单属性
ylbtech-HTML5: HTML5 表单属性 1.返回顶部 1. HTML5 表单属性 HTML5 新的表单属性 HTML5 的 <form> 和 <input>标签添加 ...
- 118.django中表单的使用方式
表单 HTML中的表单: 从前端来说,表单就是用来将数据提交给服务器的,不管后台使用的是django还是php等其他的语言.只要把input标签放在form标签中,然后再添加一个提交的按钮,就可以将i ...
随机推荐
- POJ 3661 (线性DP)
题目链接: http://poj.org/problem?id=3661 题目大意:牛跑步.有N分钟,M疲劳值.每分钟跑的距离不同.每分钟可以选择跑步或是休息.一旦休息了必须休息到疲劳值为0.0疲劳值 ...
- POJ 3691 (AC自动机+状态压缩DP)
题目链接: http://poj.org/problem?id=3691 题目大意:给定N个致病DNA片段以及一个最终DNA片段.问最终DNA片段最少修改多少个字符,使得不包含任一致病DNA. 解题 ...
- oracle系列--第二篇 oracle下载
对于很多新手来说,包括我之前也是这样,知道oracle数据库,但是就是不知道在哪里下载.有时候,上到oracle官方网站上面都找不到下载的地方. 这不像apache里面那么直接,我们想下载如:tomc ...
- shell字符串和数组
字符串 : 1.单引号: str = 'value' 单引号字符串的限制: 单引号里的任何字符都会原样输出,单引号字符串中的变量是无效的: 单引号字串中不能出现单引号(对单引号使用转义符后也不行); ...
- C#获取机器码(转)
/// <summary> /// 机器码 /// </summary> public class MachineCode { /// ...
- Task<TResult> 类
https://msdn.microsoft.com/zh-cn/library/dd321424.aspx
- Struts2+Spring3+Mybatis3开发环境搭建
本文主要介绍Struts2+Spring3+Mybatis3开发环境搭建 Struts和Spring不过多介绍. MyBatis 是支持普通 SQL 查询,存储过程和高级映射的优秀持久层框架.MyBa ...
- iOS开发之UITextField的使用详解
UITextField的使用详解 UITextField控件是开发中,使用频率比较高的控件了,那么有必要总结一下. 一.UITextField手动编写控件 UITextField *txtAccou ...
- Configuration of OpenCV2.1.0 with VS2010
Add in the system Path: C:\Program Files (x86)\OpenCV-2.1.0\build\bin\Debug Project->Project Prop ...
- mysql5.6 通用二进制安装
mysql5.6 通用二进制安装: #卸载原有的mysqlyum remove mysql*ls /etc/my.cnf*mv /etc/my.cnf* /tmp/ #安装依赖包yum install ...