<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单</title>
</head>
<body>
    <form action="http://localhost" method="get" target="_blank">
        <input type="hidden" value="统计" name="tj"><br>
        用名：<input type="text" name="key" name="user" value="新镇中心" maxlength="20" autofocus="" tabindex="1"><br>
        密码：<input type="password" name="ps" name="password"><br>
        国家：<input type="text" readonly="readonly" value="中国" name="gj" accesskey="k"><br>
        地址：<input type="text" disabled="disabled" value="wenan" name="address" ><br>
        邮箱：<input type="email" name="email" required="required"><br>
        网址：<input type="url" name="url" tabindex="2" autocomplete="off"><br>
        电话：<input type="tel" tabindex="3"><br>
        数字：<input type="number" min="0" max="50" step="10" value="10" name="shuzi"><br>
        范围：<input type="range" min="0" max="100" step="5" value="20" name="fanwei"><br>
        时间：<input type="time"><br>
        日：<input type="date"><br>
        周：<input type="week"><br>
        月：<input type="month"><br>
        本地时间：<input type="datetime-local"><br>
        UTC时间：<input type="datetime"><br>
        颜色：<input type="color"><br>
        搜索：<input type="search" placeholder="输入关键词"><br>
        文件：<input type="file" accept="image/png" multiple="multiple"><br>
        复选框：<input type="checkbox" name="dx" value="a">平面设计
        <input type="checkbox" name="dx" value="b">绘画绘图
        <input type="checkbox" name="dx" value="c" checked="checked">会计专业
        <input type="checkbox" name="dx" value="d">立体设计
        <br>
        <hr>单选框
        <input type="radio" name="rad" value="a">先生
        <input type="radio" name="rad" value="b">女士
        <input type="radio" name="rad" value="c">保密
        <br>
        <input type="submit">
        <input type="reset">
        <!-- <input type="button" value="按钮">
        <input type="image" src="imges/ss.png"> -->
    </form>
    <!-- <div>
        <input type="text">
        <input type="submit">
        表单之外的元素也可以使用
    </div> -->
    <!-- <figure>
        <img src="pic/1.png" alt="图片">
    </figure>
    <figcaption>
        图片内容
    </figcaption> -->
</body>
</html>

html5-表单和input元素用法的更多相关文章

  1. HTML表单之input元素的23种type类型

    摘自:http://www.cnblogs.com/xiaohuochai/p/5179909.html 了解HTML表单之input元素的23种type类型 随着HTML5的出现,input元素新增 ...

  2. 了解HTML表单之input元素的23种type类型

    目录 传统类型 text password file radio checkbox hidden button image reset submit 新增类型 color tel email url ...

  3. 了解HTML表单之input元素的30个元素属性

    目录 传统属性 name type accept alt checked disabled readonly maxlength size src value 新增属性 autocomplete au ...

  4. html5表单新增的元素与属性

    1.表单内元素的form属性 在html4中,表单内的从属元素必须书写在表单内部, 而在html5中,可以把他们书写在页面上任何地方, 然后为该元素指定一个form属性,属性值为该表单的id,这样就可 ...

  5. HTML5表单之Input 类型- Date Pickers（日期选择器）

    HTML5 拥有多个可供选取日期和时间的新输入类型: date-选取日.月.年 month-选取月.年 week-选取周和年 time-选取时间(小时和分钟) datetime-选取时间.日.月.年( ...

  6. html form表单追加input元素后在提交

    form.append(input); //input为对象 (设置name和val有效) $("#form1").submit();//提交事件

  7. 服务器变量 超级全局数组$_SERVER (附加超简单表单与html5表单属性)

    001.html <html> <head><title>user log</title> <meta http-equiv="cont ...

  8. HTML5 表单元素和属性

    HTML5 表单元素和属性学习 版权声明:未经博主授权,内容严禁转载 ! 表单元素简介 无论实现提交功能还是展示页面功能,表单在HTML中的作用都十分重要. 在其他版本的HTML中,表单能够包含的元素 ...

  9. [html5] 学习笔记-表单新增的元素与属性（续）

    本节主要讲解表单新增元素的controls属性.placeholder属性.List属性.Autocomplete属性.Pattern属性.SelectionDirection属性.Indetermi ...

随机推荐

  1. LeetCode 349 Intersection of Two Arrays 解题报告

    题目要求 Given two arrays, write a function to compute their intersection. 题目分析及思路 给定两个数组,要求得到它们之中共同拥有的元 ...

  2. springboot 整合swagger-ui

    一.添加maven依赖 <dependency> <groupId>io.springfox</groupId> <artifactId>springf ...

  3. Django 正向解析与反向解析

    正向解析就是按照顺序查找访问(urls.py---view--templates) 反向解析就是根据命名空间命名来调到指定的页面 用反向解析的原因: 随着功能的增加会出现更多的视图,可能之前配置的正则 ...

  4. 理解Python的双下划线命名（转）

    add by zhj:今天在学习SimpleHTTPServer的源代码时,看到了Python标准库SocketServer模块中有个BaseServer类,该类的__init__方法定义如下 def ...

  5. jq优化

    1.使用链式写法 $('div').find('h3').eq(2).html('Hello');采用链式写法时,jQuery自动缓存每一步的结果,因此比非链式写法要快.根据测试,链式写法比(不使用缓 ...

  6. aws小结

    IAM:亚马逊访问权限控制(AWS Identity and Access Management ) https://www.cnblogs.com/andy9468/p/10635019.html ...

  7. Centos6.5+Redmine

    花了两天时间,基于centos6.5操作系统,搭建了redmine环境,在这里记录下过程中遇到的问题以及搭建流程. centos6.5; redmine2.5.0; Ruby1.9.3; step 1 ...

  8. MySQL大表DROP删除小技巧(转)

    在日常工作中,经常会遇到历史大表从主库上迁移到备份机,以便腾出主库空间,那么如果你直接drop table 后,可能会引起数据库抖动,连接数升高等问题,从而影响业务. 那么用一个小技巧,即可轻松平滑的 ...

  9. zookeeper三种模式安装详解（centos 7+zookeeper-3.4.9）

    zookeeper有单机.伪集群.集群三种部署方式,可根据自己实际情况选择合适的部署方式.下边对这三种部署方式逐一进行讲解. 一 单机模式 1.下载 进入要下载的版本的目录,选择.tar.gz文件下载 ...

  10. axios post、get 请求参数和headers配置

    axios.post("http://xxx.com/xxx/xxx/xxx?", { 'queslistid':this.kemuid }, { headers: {'token ...