H5制作简单登录界面

本篇文章主要介绍如何用html5制作一个简单的登录界面,有感兴趣的小伙伴参考下。

代码如下:

<!DOCTYPE html>
<html>
    <head>
        <Meta charset=UTF-8>
        <title></title>
        <style type=text/css>
            .jieshao{
                width: 300px;
                border-bottom: 2px dashed;
            }
            .div0{
                width: 400px;
                border: 1px solid cornflowerblue;
                line-height: 30px;
                padding-left: 50px;
            }
            .zi{
                font-size: 13px;
            }
        </style>
    </head>
    <body>
        <div class=div0>
        <form action=http://www.baidu.com method=post>
            <span style=padding-left: 33px;>昵称:<input type=text name=wd id=wd value= /></span></br>
            真实姓名:<input type=password name=ps id=ps value=123456 />
            <select name=>
                <option value=所有人可见>所有人可见</option>
                <option value=仅自己可见>仅自己可见</option>
            </select><br />
            <span style=padding-left: 18px;>所在地 : <select name=>
                <option value=北京>北京</option>
                <option value=武汉>武汉</option>
            </select>
            <select name=>
                <option value=朝阳区>朝阳区</option>
                <option value=洪山区>洪山区</option>
            </select></span><br />
            <span style=padding-left: 33px;>生日 : <select name=>
                <option value=2009>2009</option>
                <option value=1997>1997</option>
            </select>
            年<select name=>
                <option value=01>01</option>
                <option value=08>08</option>
            </select>
            日<select name=>
                <option value=01>01</option>
                <option value=18>18</option>
            </select>
                   <select name=>
                <option value=保密>保密</option>
                <option value=不保密>不保密</option>
            </select></span><br />

            博客地址:<input type=text name=wd id=wd value= />
                <select name=>
                <option value=所有人可见>所有人可见</option>
                <option value=仅自己可见>仅自己可见</option>
            </select><br />

            常用邮箱:mofeiangmotao@sina.com<br />

            <span style=padding-left: 36px;>QQ:<input type=text name=wd id=wd value= /></span><br />

            <span style=padding-left: 28px;>EMS:<input type=text name=wd id=wd value= /></span><br />
            <span style=padding-left: 30px;>介绍:</span>
            <div class=jieshao >
            <textarea  name= rows=10 cols=20 style=resize: none;  width: 300px;height: 100px; > 
            </textarea>
            </div>
            <p class=zi>以下信息可作为通过客服取回账号的依据</p>
            证件类型  : </select>
                   <select name=>
                <option value=身份证>身份证</option>
            </select><br />

            证件号码 : <input type=text name=wd id=wd value= /><br />

            <input type=submit name= id= value=保存 />


        </form>
        </div>
    </body>
</html>

相关推荐:

使用Ajax安全的登录界面

CSS3制作粉红色登录界面

使用jQuery,Angular实现登录界面验证码实例分享

Ajax实现带有验证码的局部刷新登录界面

相关文章

HTML5和CSS3实现3D展示商品信息的代码
利用HTML5中的Canvas绘制笑脸的代码
Html5剪切板功能的实现
如何通过HTML5触摸事件实现移动端简易进度条
Html5移动端获奖无缝滚动动画实现
关于HTML5和CSS3实现机器猫的代码