网站首页  汉语字词  英语词汇  考试资料  写作素材  旧版资料

请输入您要查询的考试资料：

　

标题 html5注册页面示例代码
内容
    代码如下:
    <!doctype html>
    <html>
    <head>
    <title>register.html</title>
    <meta http-equiv=keywords content=keyword1,keyword2,keyword3>
    <meta http-equiv=description content=this is my page>
    <meta http-equiv=content-type content=text/html; charset=utf-8>
    <link rel=shortcut icon href=favicon.ico />
    <link rel=stylesheet type=text/css href=css/register.css />
    <script src=js/checkbox.js type=text/javascript>
    </script>
    <script type=text/javascript>
    function play(){
    document.getelementbyid(menu_item).style.display = ;
    }
    function noplay(){
    document.getelementbyid(menu_item).style.display = none;
    }
    function passwd(){
    var pass = document.getelementbyid(password).value;
    var tip = document.getelementbyid(tip);
    if (pass.length < 4) {
    document.getelementbyid(meter).value = pass.length;
    tip.innerhtml = 差;
    }
    else
    if (pass.length <= 8) {
    document.getelementbyid(meter).value = pass.length;
    tip.innerhtml = 中;
    }
    else {
    document.getelementbyid(meter).value = pass.length;
    tip.innerhtml = 高;
    }
    }
    </script>
    </head>
    <body>
    <div id=3 style=position: relative; top: 100px; z-index: 3;>
    <form id=f1 action=register.html method=post>
    <table cellspacing=0 class=table>
    <tr class=thead>
    <td>
    会员注册
    </td>
    </tr>
    <tr>
    <td>
    <table id=registertable border=0px border=0px cellspacing=0 cellpadding=5px>
    <tr>
    <tr>
    <td align=right>
    员工编号：
    </td>
    <td align=left>
    <input type=text name=username placeholder=用户名 required/>
    </td>
    </tr>
    <tr>
    <td align=right>
    密 码：
    </td>
    <td align=left>
    <input type=password name=password id=password placeholder=密码 required onkeyup=passwd()/>
    <meter min=1 max=10 low=5 high=8 value=0 id=meter>
    </meter>
    <span id=tip></span>
    </td>
    </tr>
    <tr>
    <td align=right>
    密码确认：
    </td>
    <td align=left>
    <input type=password name=password2 placeholder=确认密码 required/>
    </td>
    </tr>
    <tr>
    <td align=right>
    生 日：
    </td>
    <td align=left>
    <input type=date name=borthday />
    </td>
    </tr>
    <tr>
    <td align=right>
    性 别：
    </td>
    <td align=left>
    <input type=radio name=gender value=0 checked/>男
    <input type=radio name=gender value=1/>女
    </td>
    </tr>
    <tr>
    <td align=right>
    邮 箱：
    </td>
    <td align=left>
    <input type=email name=email placeholder=邮箱 id=email required/>
    </td>
    </tr>
    <tr>
    <td align=right>
    手 机：
    </td>
    <td align=left>
    <input type=tel pattern=[0-9]{11} id=p name=phone placeholder=请输入11位数字 />
    </td>
    </tr>
    <tr>
    <td align=right>
    地 址：
    </td>
    <td align=left>
    <input type=text name=address placeholder=地址 list=l/>
    <datalist id=l>
    <option value=sh>上海</option>
    <option value=bj>北京</option>
    <option value=js>江苏</option>
    <option value=zz>郑州</option>
    <option value=sz>深圳</option>
    </datalist>
    </td>
    </tr>
    <tr>
    <td align=right>
    个人网页：
    </td>
    <td align=left>
    <input type=url name=page placeholder=主页网址 />
    </td>
    </tr>
    <tr>
    <td align=right>
    起床时间：
    </td>
    <td align=left>
    <input type=time name=bed onblur=pro()/>
    </td>
    </tr>
    <tr>
    <td align=right>
    头像：
    </td>
    <td align=left>
    <input type=file id=f accept=image/jpeg onchange=show()/><span><img id=img src= width=60 height=60 /></span>
    <script>
    function show(){
    var file = document.getelementbyid(f).files[0];
    var filereader = new filereader();
    filereader.readasdataurl(file);
    filereader.onload = function(){
    document.getelementbyid(img).src = filereader.result;
    }
    }
    </script>
    </td>
    </tr>
    <tr>
    <td colspan=2>
    <details>
    <p>
    允许注册
    <mark>
    许可证
    </mark>信息
    </p>
    <summary>
    注册许可信息
    </summary>
    </details>
    </td>
    </tr>
    <tr>
    <td align=right>
    验证码：
    </td>
    <td valign=middle>
    <input type=text name=captcha size=11 maxlength=4 title=输入右边的验证码 />
    <span id=span></span>
    <script>
    var span = document.getelementbyid(span);
    span.innerhtml=math.floor(math.random());
    </script>
    </td>
    </tr>
    <tr height=60px>
    <td colspan=2>
    <input type=button value=转到登录 onclick=window.location.replace('login.html') id=btn1 onmousemove=changebgcolor('btn1') onmouseout=recoverbgcolor('btn1') class=submit /> <input type=submit accesskey=enter value=注册 id=btn onmousemove=changebgcolor('btn') onmouseout=recoverbgcolor('btn'); class=submit formmethod=post/>
    </td>
    </tr>
    </table>
    </td>
    </tr>
    </table>
    </form>
    </div>
    </body>
    </html>
    代码如下:
    body {
    background-image: url(../images/bg.jpg);
    text-align: center;
    background-repeat: repeat-x;
    background-position: 0px 0px ;
    background-size：
    }
    .table {
    border: 1px solid #90bfff;
    width:810px;
    }
    tr {
    font-family: 微软雅黑;
    font-weight:800;
    color: #448ef3;
    }
    input{
    border: 1px solid #448ef3;
    color: #448ef3;
    font-weight:bold;
    font-family: 微软雅黑;
    height: 35px;
    line-height: 30px;
    border-radius:5px;
    }
    .submit {
    width: 150px;
    height: 40px;
    cursor :hand;
    font-size: 20px;
    color: #ffffff;
    background-color: #448ef3;
    border: 0px;
    }
    .thead {
    height: 40px; background : #90bfff;
    font-family: 微软雅黑;
    font-size: 30px;
    font-weight: 700;
    color: #ffffff;
    background: #90bfff;
    }
    #3{
    margin-bottom: 100px;
    }
    代码如下:
    function chkallclick(sonname, cballid){
    var arrson = document.getelementsbyname(sonname);
    var cball = document.getelementbyid(cballid);
    var tempstate=cball.checked;
    for(i=0;i<arrson.length;i++) {
    if(arrson[i].checked!=tempstate)
    arrson[i].click();
    }
    }
    function chksonclick(sonname, cballid) {
    var arrson = document.getelementsbyname(sonname);
    var cball = document.getelementbyid(cballid);
    for(var i=0; i<arrson.length; i++) {
    if(!arrson[i].checked) {
    cball.checked = false;
    return;
    }
    }
    cball.checked = true;
    }
    function chkoppclick(sonname){
    var arrson = document.getelementsbyname(sonname);
    for(i=0;i<arrson.length;i++) {
    arrson[i].click();
    }
    }
    function changebgcolor(btn){
    var btn = document.getelementbyid(btn);
    btn.style.backgroundcolor = #90bfff
    }
    function recoverbgcolor(btn){
    var btn = document.getelementbyid(btn);
    btn.style.backgroundcolor = #448ef3
    }
    ------------------------------------------------
    上面文件的顺序是：register.html register.css checkbox..js
    -------------------------------------------------
    背景图片：bg.jpg
随便看

　

在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。

　

Copyright © 2002-2024 cuapp.net All Rights Reserved
更新时间：2025/12/16 6:30:27