表单:收集用户信息

一、 组成:

      文本框<input type="text"/>

      密码框<input type="password"/>

      单选框<input type="radio"/>

      多选<input type="checkbox"/>

      基础下拉框:

          <select>

              <option></option>

          </select>

      多选下拉框:

          <select multiple="multiple">

            <option></option>

          </select>  

      分组下拉框:

          <select>

            <optgroup label="北京">

              <option></option>

            </optgroup>

          </select>

      多行文本框:

          <textarea></textarea>

      文件:

          <input type="file"/>

      按钮:

          提交按钮:<input type="submit" value="提交 "/>

          重置按钮:<input type="reset" value="重置"/>

          普通按钮:<input type="button" value="普通"/>

          图片按钮:<input type="image" src="地址"/>

       表单域:

           <fieldset>

            <legend></legand>

           </fieldset>

二、实操练习

      

    代码:

      

<!--<embed src="like.mp3" hidden="true"></embed>-->
<marquee behavior="alternate" derection="up">注册好礼多多</marquee>
<form action="" methord="post">
  <fieldset>
      <legend>用户注册</legend>
      用户名:<input type="text" maxlength="12" readonly="readonly" disable="disable" value="宋巧丽"/>
      <br/><br/><br/>
      密码:<input type="password" />
      <br/><br/><br/>
      性别:<input type="radio" name="xb" value="0"/>
      男
      <input type="radio" name="xb" value="1" checked="checked"/>女
      <br/><br/><br/>
      爱好:
      <input type="checkbox" name="xq" value="羽毛球" />羽毛球
      <input type="checkbox" name="xq" value="冰棒球" checked="checked"/>冰棒球
      <input type="checkbox" name="xq" value="全能"/>全能
      <br/><br/><br/>
      所在省:
      <select>
          <option value="1001">北京</option>
          <option value="1015">天津</option>
      </select><br/><br/><br/>
      亲属团成员:
      <select multiple="multiple">
          <option value="fuqin">父亲</option>
          <option value="muqin">母亲</option>
          </select><br/><br/><br/>
      籍贯:
     <select>
        <optgroup label="北京">
        <option>海淀区</option>
        <option>昌平区</option>
        <option>通州区</option>
        </optgroup>
    </select>

    <br/><br/><br/>
    头像:
        <input type="file"/><br/><br/><br/>
    自我介绍:<textarea cols="50" rows="10"></textarea><br/><br/><br/><br/><br/><br/>
        <input type="button" value="验证"/>
        <input type="submit" value="提交"/>
        <input type="reset" value="重置"/>
        <input type="image" src="http://pic.qiantucdn.com/58pic/13/88/40/76b58PICeqz_1024.png!/format/webp" width="100" height="50" value="测试"/>
</fieldset>

</form>

h5标签基础 表单form的更多相关文章

  1. <form> 标签 // HTML 表单 // from 表单转换成json 格式

    <form> 标签   // HTML 表单    // from 表单转换成json 格式 form 表单,对开发人员来说是在熟悉不过的了,它是页面与web服务器交互时的重要信息来源 表 ...

  2. HTML中的表单<form>标签

    一.HTML表单 HTML 表单用于搜集不同类型的用户输入. HTML 表单包含表单元素,表单元素指的是不同类型的 input 元素.复选框.单选按钮.提交按钮等等. 关于表单的更多内容可以参考htt ...

  3. 微信小程序基础之表单Form的使用

    表单Form的应用很广泛,我们可以利用form设计登录注册,也可以设计一种答题问卷的形式,今天主要讲一下form的使用 form表单,将组件内输入的"switch","i ...

  4. 制作Html标签以及表单、表格内容

    制作Html一般用DW(......),Html全称为(Hyper Text Markup Language   超文本标记语言) 文本就是平常电脑上的文本文档,只能存储文字,而超文本文档可以存储音乐 ...

  5. 表单form的属性,单行文本框、密码框、单选多选按钮

    基础表单结构: <body> <h1> <hr /> <form action="" name="myFrom" en ...

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

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

  7. amazeui学习笔记--css(HTML元素3)--表单Form

    amazeui学习笔记--css(HTML元素3)--表单Form 一.总结 1.form样式使用:在容器上添加 .am-form class,容器里的子元素才会应用 Amaze UI 定义的样式. ...

  8. web之表单form

    表单是我们平常编写Web应用常用的工具,表单(<form>)用来收集用户提交的数据,发送到服务器.比如,用户提交用户名和密码,让服务器验证,就要通过表单.表单是一个包含表单元素或控件的区域 ...

  9. bootstrap 基础表单

    表单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文本域和按钮等.其中每个控件所起的作用都各不相同,而且不同的浏览器对表单控件渲染的风格都各有不同. ☑   LESS版本:对应源文 ...

随机推荐

  1. 2.5. Integer 16 、Integer 32、Integer 64(Core Data 应用程序实践指南)

    Core Data 使用 “带符号的整数”,通常我们会选择Integer 32,如果不够,可以升级为Integer 64 (第3章),通过升级托管对象模型. 这三种类型对应的特性(Property)类 ...

  2. js原生设计模式——13桥接模式(相同业务逻辑抽象化处理的职责链模式)

    桥接模式之多元化类之间的实例化调用实例 <!DOCTYPE html><html lang="en"><head>    <meta ch ...

  3. android 类似QQ底部输入框弹出键盘和面板冲突 布局闪动处理方案(转)

    先看下效果 差不多就是解决这种冲突,布局闪动的 作者的githup :https://github.com/Jacksgong/JKeyboardPanelSwitch Android键盘面板冲突 布 ...

  4. jQuery replaceWith replaceAll end的用法

    jQuery replaceWith replaceAll end的用法 <%@ page language="java" import="java.util.*& ...

  5. 基于basys2驱动LCDQC12864B的verilog设计图片显示

    话不多说先上图 前言 在做这个实验的时候在网上找了许多资料,都是关于使用单片机驱动LCD显示,确实用单片机驱动是要简单不少,记得在FPGA学习交流群里问问题的时候,被前辈指教,说给我最好的指教便是别在 ...

  6. EntityFramework Core Raw Query再叙注意事项后续

    前言 话说通过EntityFramwork Core进行原始查询又出问题,且听我娓娓道来. EntityFramework Core Raw Query后续 当我们进行复杂查询时我们会通过原始查询来进 ...

  7. vijos P1001 谁拿了最多奖学金

    vijos P1001 谁拿了最多奖学金 描述 某校的惯例是在每学期的期末考试之后发放奖学金.发放的奖学金共有五种,获取的条件各自不同: 1) 院士奖学金,每人8000元,期末平均成绩高于80分(&g ...

  8. SpringMVC通过实体类返回json格式的字符串,并在前端显示

    一.除了搭建springmvc框架需要的jar包外,还需要这两个jar包 jackson-core-asl-1.9.2.jar和jackson-mapper-asl-1.9.2.jar 二.web,. ...

  9. Java如何判断字符串中包含有全角,半角符号

    首先介绍下全角跟半角之间的区别: 在计算机屏幕上,一个汉字要占两个英文字符的位置,人们把一个英文字符所占的位置称为"半角",相对地把一个汉字所占的位置称为"全角" ...

  10. 无线网络中,使用MDK3把指定的用户或者热点踢到掉线

    准备 1:系统环境为ubuntu16.04, 2:需要mdk3, mdk3这个软件需要通过apt安装, 需要kali系统的源 3:需要安装aircrack-ng套件 今天这套东西,可以在未连接上靶机网 ...