一、常用表单标签如下:

(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中表单的创建的更多相关文章

  1. HTML5中表单验证的8种方法(转)

    在深人探讨表单验证之前,让我们先思考一下表单验证的真实含义.就其核心而言,表单验证是一套系统,它为终端用户检测无效的控件数据并标记这些错误.换言之,表单验证就是在表单提交服务器前对其进行一系列的检查并 ...

  2. HTML5中表单验证的8种方法

    HTML5中表单验证的8种方法 2012-4-21 11:00| 发布者: benben| 查看: 2765| 评论: 0 摘要: 前一篇,我们介绍了HTML5中新的表单特性和函数, 今天就继续来谈谈 ...

  3. HTML5中表单元素的formaction属性

    在submit按钮中,根据不同的submit按钮,将表单提交到不同的页面中: <form id="test" action="test.jsp"> ...

  4. HTML5表单及其验证

    随笔- 15 文章- 1 评论- 115 HTML5表单及其验证   HTML表单一直都是Web的核心技术之一,有了它我们才能在Web上进行各种各样的应用.HTML5 Forms新增了许多新控件及其A ...

  5. 利用HTML5与jQuery技术创建一个简单的自动表单完成

    来源:GBin1.com 在线演示   在线下载 谷歌快速搜索自带大量自动完成插件——库中甚至还有一个附带的jQuery UI共享选项.然而今天我要寻找一个替代的解决方案.由DevBridge开发的j ...

  6. HTML5学习总结-05 HTML5表单

    一 HTML5 新的类型 HTML5 拥有多个新的表单输入类型.这些新特性提供了更好的输入控制和验证. email url number range Date pickers (date, month ...

  7. html5表单重写

    html5表单重写 一.总结 一句话总结: 表单重写用于在提交按钮上指定表单提交的各种信息,比如action <input type="submit" value=" ...

  8. HTML5: HTML5 表单属性

    ylbtech-HTML5: HTML5 表单属性 1.返回顶部 1. HTML5 表单属性 HTML5 新的表单属性 HTML5 的 <form> 和 <input>标签添加 ...

  9. 118.django中表单的使用方式

    表单 HTML中的表单: 从前端来说,表单就是用来将数据提交给服务器的,不管后台使用的是django还是php等其他的语言.只要把input标签放在form标签中,然后再添加一个提交的按钮,就可以将i ...

随机推荐

  1. html5中manifest特性测试

    测试环境和工具   chromium  18.0.1025.151 (开发编译版 130497 Linux) Ubuntu 11.04 一.测试内容 1.A页面manifest缓存的js文件,B页面不 ...

  2. CC150 - 11.3

    Question: Given a sorted array of n integers that has been rotated an unknown number of times, write ...

  3. JavaScript基础知识总结

    正则表达式: 是一种专门用于操作字符串规则. 正则表达式: 通过一些符号来表达,简化对字符串的复杂操作. 弊端:阅读性较差 常见操作: 1.匹配 String matches(regex) 2.获取( ...

  4. 【TYVJ】1359 - 收入计划(二分)

    http://tyvj.cn/Problem_Show.aspx?id=1359 一开始是一眼看出是二分的,因为这里有单调性,因为取钱是一次取完并且是连续的. 所以最优取法就是准备达到某个价值再取.最 ...

  5. 微信企业号办公系统-JSSDK上传图片(多图上传)

    在开发微信企业号办公系统中,涉及到了图片上传功能,一开始使用的flash插件上传方法,在苹果手机上可以调用相机直接拍摄照片,但在安卓手机上只能选择照片. 微信jssdk-api带有一套完整的调用选择本 ...

  6. html ul 里 能放其他标签吗,比如h3、p?

    按标准的话,ul 里面应该只能放li,不过看见同事有的放了h3.p这些,这样到底可不可以?   <ul>里面只能放<li>.但是<li>里面可以放<h*> ...

  7. 导航栏下a标签失效的原因

    前天我一直没找到失效的结果,就在刚才,我用不同的浏览器打开我编写的网页,有一个浏览器的图片循环播放效果错位了,我觉得就是它上边的div把他挤下来了.正如前天网上看到的高手的们的说法.我用firebug ...

  8. 利用窗口引用漏洞和XSS漏洞实现浏览器劫持

    ==Ph4nt0m Security Team==                        Issue 0x03, Phile #0x05 of 0x07 |=----------------- ...

  9. shenyi 语录

    [讲师]沈逸(65480539) 2016-06-08 14:58:42   会centos 转redhat是分分钟的事 [讲师]沈逸(65480539) 2016-06-08 14:58:54 查看 ...

  10. [GE]手动截取当前活动窗口,并且按规则命名(1/2)

    Function Take-ScreenShot { <# .SYNOPSIS Used to take a screenshot of the desktop or the active wi ...