HTML5 - 用户注册表单

用户注册

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>用户注册</title>
</head>
<body>
    <h2>用户注册</h2>
    <form action="" method="post">
        <!-- 隐藏域 -->
        <input type="hidden" name="uid" value="9527" />
        <table border="0" cellpadding="0" cellspacing="0" width="400px">
            <tr>
                <td align="right"><label for="name">姓名：</label></td>
                <td><input type="text" name="name" id="name"/></td>
            </tr>
            <tr>
                <td align="right">用户名：</td>
                <td><input type="text" name="username"  readonly="readonly" value="tom"/></td>
            </tr>
            <tr>
                <td align="right">密码：</td>
                <td><input type="password" name="pwd"/></td>
            </tr>
            <tr>
                <td align="right">确认密码：</td>
                <td><input type="password" name="repwd"/></td>
            </tr>
            <tr>
                <td align="right">电子邮箱：</td>
                <td><input type="text" name="email"/></td>
            </tr>
            <tr>
                <td align="right">性别：</td>
                <td>
                    <input type="radio" name="sex" value="male" checked="checked" id="male" />
                    <label for="male"><img src="images/Male.gif"/>男</label>&nbsp;
                    <input type="radio" name="sex" value="female"/>
                    <img src="images/Female.gif"/>女
                </td>
            </tr>
            <tr>
                <td align="right">头像：</td>
                <td><input type="file" name="touxiang"/></td>
            </tr>
            <tr>
                <td align="right">爱好：</td>
                <td>
                    <input type="checkbox" name="hobby" value="eat" checked="checked" />吃饭&nbsp;&nbsp;
                    <input type="checkbox" name="hobby" value="sleep" />睡觉&nbsp;&nbsp;
                    <input type="checkbox" name="hobby" value="doudou" />打豆豆&nbsp;&nbsp;
                </td>
            </tr>
            <tr>
                <td align="right">出生日期：</td>
                <td>
                    <input type="text" name="year" size="10"/>年&nbsp;
                    <select name="month">
                        <option value="0" selected="selected">--月份--</option>
                        <option value="1">一月</option>
                        <option value="2">二月</option>
                        <option value="3">三月</option>
                        <option value="4">四月</option>
                        <option value="6">六月</option>
                    </select>月&nbsp;&nbsp;
                    <input type="text" name="day" size="6"/>日
                </td>
            </tr>
            <tr>
                <td align="right">注册协议：</td>
                <td>
                    <textarea rows="4" cols="20" name="intr" readonly="readonly">
                        请遵守相关法律法规。。。
                    </textarea>
                </td>
            </tr>
            <tr>
                <td></td>
                <td>
                    <input type="submit" value="注册" disabled="disabled" />&nbsp;&nbsp;
                    <input type="image" src="images/reset.gif" />&nbsp;&nbsp;
                    <!--<input type="button" value="普通按钮"/>
                --></td>
            </tr>
        </table>
    </form>
</body>
</html>

时间： 2024-08-25 18:25:15

HTML5 - 用户注册表单的相关文章

HTML5 智能表单

1.表单新增属性 ? autofocus 属性 <input type="text" autofocus/>设置 autofocus 属性,使文本框自动获得焦点注意:一个页面中最多只能有一个表单元素设置该属性,否则功能将失效,建议对第一个input元素设置autofocus属性. ? formaction 属性 <input type="submit" formaction="处理逻辑"><!-- 处理逻辑可为a

HTML5的表单新特性(2)

HTML5 表单新特性:等待了12年之久,我们迎来了HTML5主要修订版本.虽然此版本仍处于测试阶段并且没有宣布正式推出的日期,HTML5的网页设计师和程序员已经就开始关注,并对最新功能展开了热烈讨论. HTML5新特性的目的是改善嵌入,比如视频和音频等多媒体的支持,为开发者和终端用户供简单的编程和更好的用户体验.现在互联网世界都在等待,浏览器更新时能支持HTML5的新版本.HTML5已经被很多浏览器支持,比如Safari, Chrome, FireFox, Opera, IE9,它是向后兼容的

HTML5的表单新特性(3)

虽然目前各种浏览器对HTML5的支持程度参差不齐,但是不可否认HTML5将会成为未来的流行趋势. 一.HTML5表单新增属性 (1)placeholder 这个属性的用处是颇大的,可以向用户显示描述性说明或者提示信息.如果浏览器不支持的话,此属性会忽略掉,显示浏览器默认的状态.当输入框中有值或者获得焦点的时候,不显示placeholder的值 eg: 您的名字: <input type="text" placeholder="请输入您的真实姓名" name

精美的HTML5/CSS3表单带小图标

今天我们要来分享一款非常精美的HTML5/CSS3表单,准备地说,这是一款经过美化的input输入表单,每一个输入表单都可以定义其两侧的小图标,非常华丽.另外,这款表单应用还采用了3种不同的风格主题,你可以在演示页的菜单栏中选择一种样式.需要高版本的浏览器才能支持. 你也可以在这里在线演示下面我们来简单分析一下这款表单的源代码,源代码由HTML代码.CSS代码及Javascript代码组成.一共3组样式,我们只对其中一组作解说. HTML代码: <ul data-for="prefix&

JSP简单练习-用户注册表单

<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.get

5.9 HTML5 新增表单控件 ---不是特别重要

HTML5 新增表单控件新增类型:网址邮箱日期时间星期数量范围电话颜色搜索这些控件基本不使用:因为在不同的浏览器中效果不一样.产品设计中不允许多个浏览器效果不同,必须统一. <label>网址:</label><input type="url" name="" required><br><br> <label>邮箱:</label><input type=&q

HTML5+CSS：02用户注册表单

新的学期已开始接近两个月了,还记得是在国庆节那几天申请的博客账号,可过了一个月都还没开始写博客,(>_<)有点小偷懒了,不过,学习还是不能落下的,今写一个有点实践运用的关于表单网页的代码,希望能够帮助到跟我一样H5的小白们,也请各位大佬多多指教!! 首先,先上我们敲的表单样式(如下): 其次,代码接上吖,Html5代码如下: <!DOCTYPE html><html> <head> <meta charset="UTF-8

【HTML5】表单属性

* autocomplete autocomplete 属性规定 form 或 input 域应该拥有自动完成功能. 注释:autocomplete 适用于 <form> 标签,以及以下类型的 <input> 标签:text, search, url, telephone, email, password, datepickers, range 以及 color. 当用户在自动完成域中开始输入时,浏览器应该在该域中显示填写的选项: <!DOCTYPE HTML> <

html5新增表单元素和属性

从三方面来介绍html5表单的新特性表单结构更灵活要提交数据的控件可以布局在form标签之外,看下面的代码,表单元素可以写到form元素之外,只需在元素中加入form="form1"属性,也可提交到form元素指定的服务器地址 <body><form action="upload.php" method="post" accept-charset="utf-8" id="form1"&g