橙色简洁样式bootstrap多用途注册登录网页模板



4 14 5



模板描述:bootstrap多用途注册登录,

代码结构

1. 引入CSS

<link type="text/css" rel="stylesheet" href="css/common.css" />
<link type="text/css" rel="stylesheet" href="css/style.css" />
<link type="text/css" rel="stylesheet" href="css/login.css" />

2. HTML代码

<!--头部开始-->
<div class="header">
   <div class="header_n">
      <div class="header_logo"></div>
      <div class="header_nav" style=" width:170px">
         <ul class="ul1">
           <li><a href="#">简历推荐</a></li>
           <li><a href="#">知页社区</a></li>
         </ul>
      </div>
   </div>
</div>
<!--头部结束-->
<div class="log_main">
   <h1>5分钟<br />生成一份惊艳的简历</h1>
   <div class="rygl_up">
      <ul id="tab">
         <li class="current">注册</li>
         <li>登录</li>
      </ul>
      <div id="content">
         <ul style="display:block;">
             <div class="zhuce">
                <input name="" type="text" placeholder="请输入手机号" class="zhuce_num"/>
                <input name="" type="text" placeholder="请设置密码(6-16位)" class="zhuce_psd"/>
                <input name="" type="button" value="立即注册" class="zhuce_btn"/>
             </div>      
         </ul>
         <ul> 
            <div class="denglu">
                <input name="" type="text" placeholder="请输入手机号" class="denglu_num"/>
                <input name="" type="text" placeholder="请输入密码" class="denglu_psd"/>
                <div class="denglu_zidong">
                   <input name="" type="checkbox" value="" checked="checked" class="fuxuan"/>
                   <span>下次自动登录</span>
                   <span style=" float:right">忘记密码?</span>
                </div>
                <a href="#"><input name="" type="button" value="登录" class="denglu_btn"/></a>
             </div>            
         </ul>
      </div>
   </div>
</div>
<div style=" clear:both"></div>
<!--尾部开始-->
<div class="footer" style="margin-top:2px;">
   <div class="footer-1">
      <ul class="footer-1-ion">
         <li class="f-qq"><img src="images/qq.png" /></li>
         <li class="f-xl"><img src="images/xl.png" /></li>
         <li class="f-ma"><img src="images/ma.png" /></li>
         <li class="f-zf"><img src="images/zf.png" /></li>
      </ul>
      <div style="clear:both"></div>
      <ul class="footer-1-us">
         <li>关于知页</li>
         <li>加入我们</li>
         <li>联系我们</li>
      </ul>
      <div class="bianhao">Copyright © 2015 登录 (沪ICP备********3号)</div>
   </div>
</div>
<!--尾部结束-->



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 分类 响应式 自适应 设备 风格 颜色 bootstrap bootstrap自适应 bootstrap响应式 pc+wap 移动+电脑 手机+电脑 简洁 简约 简单 橙色 大气 霸气 登录 登录页 登录界面

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到