html+javascript登录注册界⾯源码
博主在学习web前端时接触到⼏个较为⾼⼤上的登陆注册界⾯,在这⾥分享给⼤家
效果图如下:(代码较多只展⽰⼀个)有需要的可以下载:
`
普通登录
⼿机⽆密码登录
</div>
<div class="aui-register-form-item">
<p class="aui-for-pwd">
<a class="" href="#">忘记密码</a>
</p>
<input id="aui-btn-reg" class="aui-btn-reg" placeholder=""  readonly="readonly" value="登录" >
</div>
<div class="aui-protocol">
登录即同意
<a  href="#">《17素材⽹使⽤协议》</a>&
<a  href="#">《隐私权条款》</a>
</div>
<div class="aui-thirds">
<a href="#">
<i class="aui-qq-img"></i>
<i>QQ登录</i>
</a>
<a href="#">
<i class="aui-wx-img"></i>
<i>登录</i>
</a>
<a href="#">
<i class="aui-wb-img"></i>
<i>微博登录</i>
</a>
<div class="clear"></div>
</div>
</div>
<!--⼿机动态码登录-->
<div class="login-con" id="lc">
<div class="aui-register-form-item">
<input type="text" name="phone" placeholder="⼿机号码" class="txt01 f-r3 required" keycodes="tel" t
abindex="1" data-valid="isNonEmpty||isPhone" dat a-error="<i class='icon-tips'></i>请输⼊⼿机号||<i class='icon-tips'></i>⼿机号码格式不正确" maxlength="11" id="phone">
<label class="focus valid"><div class="msg" ><i class='icon-tips'></i>您还未输⼊⼿机号</div></label>
<span class="aui-get-code btn btn-gray f-r3 f-ml5 f-size13" id="time_box" disabled ></span>
<span class="aui-get-code btn btn-gray f-r3 f-ml5 f-size13" id="verifyYz" >获取动态码</span>
</div>
<div class="aui-register-form-item">
<input type="text" placeholder="动态码" maxlength="6" id="verifyNo" class="txt02 f-r3 f-fl required" tabindex="2" data-valid="isNonEmpty||isInt" data-err or="<i class='icon-tips'></i>请填写正确的⼿机动态码||<i class='icon-tips'></i>请填写6位⼿机动态码">
<label class="focus valid"></label>
</div>
<div class="aui-register-form-item">
<input id="aui-btn-reg1" class="aui-btn-reg" placeholder=""  readonly="readonly" value="登录" >
</div>
<div class="aui-protocol">
登录即同意
<a  href="#">《17素材⽹使⽤协议》</a>&
<a  href="#">《隐私权条款》</a>
</div>
<div class="aui-thirds">
<a href="#">
<i class="aui-qq-img"></i>
<i>QQ登录</i>
</a>
<a href="#">
<i class="aui-wx-img"></i>
<i>登录</i>
</a>
<a href="#">
<a href="#">
<i class="aui-wb-img"></i>
<i>微博登录</i>
</a>
<div class="clear"></div>
</div>
</div>
<!-- 扫码登录 -->
<div class="saoma" id="sm">
<div class="screen-tu" id="screen">
<span class="aui-tag-size">密码登录</span>
</div>
<div class="aui-text-item">
<h1>1秒即登录,⽅便⼜安全</h1>
</div>
<div class="qr-code">
<span class="tips_img"></span>
<img src="images/code.png" alt="">
</div>
<div class="aui-tab-footer">
<p>17扫码登录,同步账户信息 | <a href="#">下载17APP</a></p>
</div>
</div>
</div>
</div>
<div class="clearfix"></div>
</div>
<div class="aui-register-bottom">
<a>©188</a>
<a href="#"></a>
<a href="#">帮助中⼼</a>
<div class="clear"></div>
</div>
</div>
`![在这⾥插⼊图⽚描述](img-blog.csdnimg/20190608232957325.png?x-oss-
html导航源码process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Blbm d4aWFuZzE5OTg=,size_16,color_FFFFFF,t_70)

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。