<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单综合练习</title>
    <style type="text/css">
      form{width: 400px;background: #f7f7f7;padding: 10px;margin-top: 150px;margin-left: 300px;}
      button{background: #808080;padding: 8px;border-radius:5px;}
      button:hover{background: #919191;padding: 10px;border-radius:5px;}
      input{padding: 8px;background: #f8f8f8;}
      input:focus{padding: 8px;background: #a9a9a9;}
    </style>
</head>
<body>
    <form action="">
        <fieldset>
        <legend>信息注册</legend>
        <p><label for="user">账号：</label><input type="text" name="user" id="user" placeholder="账号" required=""></p>
        <p><label for="password">密码：</label><input type="password" name="password" id="password" placeholder="密码"></input></p>
        <p><label for="tel">电话：</label><input type="tel" name="tel" id="tel" placeholder="电话"></p>
        <p><label for="email">邮件：</label><input type="email" name="email" id="email" placeholder="电子邮箱"></p>
        <!-- <p><label for=""></label>这样单击后自动获得焦点</p> -->

    <!--     <input type="submit" value="注册"></input> -->
    <button>注册用户</button>
        </fieldset>
    </form>
</body>
</html>

html5，表单的综合案例的更多相关文章

  1. HTML5表单验证（4个实用的表单美化案例）

    multipart/form-data 在使用包含文件上传控件的表单时,必须使用autocomplete="on" 自动补全功能novalidate 不验证 <form en ...

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

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

  3. HTML5 表单元素和属性

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

  4. 实现跨浏览器html5表单验证

    div:nth-of-type(odd){ float: left; clear: left; } .origin-effect > div:nth-of-type(even){ float: ...

  5. html5表单验证

    表单验证为终端用户检测无效的数据并标记这些错误,是一种用户体验的优化. 下面展现浏览器自带的验证功能也可在移动端中查看: HTML部分: <!DOCTYPE html> <html ...

  6. Ideal Forms – 帮助你建立响应式 HTML5 表单

    Ideal Forms 是建立和验证响应式 HTML5 表单的终极框架.它刚刚发布 V3 版本,更小,更快,更具可扩展性.它支持实时验证,完全自适应(适应容器,没有 CSS 媒体查询需要),键盘支持, ...

  7. html5 表单样式 表单验证1 2 3

    html5 表单样式 ie9以下不支持 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  8. HTML5跨浏览器表单及HTML5表单的渐进增强

    HTML5跨浏览器表单 http://net.tutsplus.com/tutorials/html-css-techniques/how-to-build-cross-browser-html5-f ...

  9. HTML5表单提交和PHP环境搭建

    HTML5表单提交相关内容和PHP环境搭建需要的软件(只备注) (2)举例介绍 (3)PHP环境搭建

随机推荐

  1. ZeroMQ接口函数之 ：zmq_bind - 绑定一个socket

    ZeroMQ 官方地址 : http://api.zeromq.org/4-0:zmq-bind zmq_bind(3) ZMQ Manual - ZMQ/3.2.5 Name zmq_bind -  ...

  2. 细读cow.osg

    细读cow.osg 转自:http://www.cnblogs.com/mumuliang/archive/2010/06/03/1873543.html 对,就是那只著名的奶牛. //Group节点 ...

  3. About_Web

    成功网站的三要诀:内容.设计.营销 内容为王: 高质量的内容会促使网站走向成功.首先,用户有需求,他们需要被感动,被娱乐,被有料的内容和产品所吸引.漂亮的背景和亮骚的特效可能会有所助益,但终究只是辅助 ...

  4. php文字、图片水印功能函数封装

    一直在做有关php文字图片上传方面的工作,所以把此功能函数整理了一次,现在分享给大家. <?php class image { var $g_img; var $g_w; var $g_h; v ...

  5. Make github as your personal maven repository

    前言: 开始用maven管理java项目后,突然发现自己写了一些通用的项目想要被别的项目依赖是件很麻烦的事.公司里项目依赖可以直接有maven仓库,但个人项目呢? github 再次显示其威力了,ex ...

  6. javascript:cors跨域postMessage、xhr2和xmldomain

    一.h5 postMessage node http-server配置服务器 有关配置:请参考我的http://www.cnblogs.com/leee/p/5502727.html 我把文件夹a配置 ...

  7. android的程序运行数据存放在哪里？

    Android应用开发中,给我们提供了5种数据的存储方式1 使用SharedPreferences存储数据2 文件存储数据3 SQLite数据库存储数据4 使用ContentProvider存储数据5 ...

  8. Mac上安装django

    参考:https://docs.djangoproject.com/en/1.9/topics/install/#installing-official-release 升级pip sudo pip ...

  9. imx6 Image Vector Table (IVT)

    imx6开启启动之后,运行板子上的ROM程序.ROM确定启动的设备,进行一些初始化,然后读取IVT,进行寄存器初始化,最后运行uboot/cpu/arm_cortexa8/start.S中的_star ...

  10. vmware rdm

    RDM即裸磁盘映射,基本思想就是将host的磁盘直接映射给虚拟机使用   需要讨论的是: 1.rdm磁盘是否允许设置为共享,即可以映射给多个虚拟机使用(vmware不可用)   在 vSphere W ...