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