H5 production of simple login interface-H5 Tutorial-php.cn

Home

Web Front-end

H5 Tutorial

H5 production of simple login interface

墨辰丷

May 10, 2018 pm 04:57 PM

html5 interface Log in

This article mainly introduces how to use html5 to create a simple login interface. Interested friends can refer to it.

The code is as follows:

<!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>

Copy after login

Related recommendations:

Use Ajax secure login interface

CSS3 to create a pink login interface

Using jQuery and Angular to share login interface verification code examples

Ajax Implement partial refresh login interface with verification code

The above is the detailed content of H5 production of simple login interface. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn