uikit用户登录
2018-02-04 08:30
204 查看
<!DOCTYPE html>
<html lang="en" class="uk-height-1-1">
<head>
<meta charset="UTF-8">
<title>Title</title>
<meta charset="utf-8">
<meta name="viewport"
content="width=device-width,user-scalable=no,initial-scale=1, minimum-scale=1, maximum-scale=1">
<title>Title</title>
<link href="uikit-2.25.0/css/uikit.almost-flat.min.css" rel="stylesheet">
<script src="jquery/jquery.js"></script>
<script src="uikit-2.25.0/components/tooltip.js"></script>
<script src="uikit-2.25.0/js/uikit.min.js"></script>
<style>
html, h1, h2, h3, h4, h5, h6 {
font-family: 'Microsoft YaHei',"Helvetica Neue",Helvetica,Arial,sans-serif!important;
}
.touch-nav {
line-height: 40px;
position: fixed;
left: 0;
top: 0;
width: 100%;
z-index: 999999;
background: #00a8e6 !important;
}
a.w1:link, a.w1:visited, a.w1:active, a.w1:hover {
color: #fff;
text-decoration: none;
}
.uk-navbar
{
background: 0;
border: 0;
text-shadow: none;
}
#top-header {
background: #fff;
height: 88px;
border-bottom: 2px solid green;
width: 100%
}
#top-header .uk-navbar-brand, #top-header .uk-navbar-content{
height: 88px;
}
#top-header .uk-navbar-nav > li > a {
height: 88px;
line-height: 88px;
font-family: "Microsoft Yahei";
font-size: 16px;
padding: 0 11px;
}
.mb-cover{
background: #f2f2f2;
}
.b20{
height: 20px;
}
.b35{
height: 35px;
}
.uk-panel-box {
background: #fff !important
}
a.b:link, a.b:visited, a.b:active {
color: #444;
text-decoration: none
}
a.b:hover {
color: #00a8e6
}
.width-100 {
width: 100% !important
}
</style>
</head>
<body class="uk-height-1-1">
<header class="uk-hidden-small" id="top-header">
<div class="uk-container uk-container-center">
<nav class="uk-navbar">
<a class="uk-navbar-brand" href="http://www.mooban.cn/" title="魔工坊">
<img src="http://www.mooban.cn/skin/moob/img/logo.png" alt="魔工坊" width="60" height="60">
</a>
<ul class="uk-navbar-nav">
<li><a href="http://www.mooban.cn/">首页</a></li>
<li class="uk-parent" data-uk-dropdown>
<a href="http://www.mooban.cn/down/">模板</a>
<div class="uk-dropdown uk-dropdown-width-2 uk-dropdown-navbar" style="width: 200px;">
<div class="uk-grid uk-dropdown-grid">
<div class="uk-width-1-2">
<ul class="uk-nav uk-nav-dropdown uk-panel">
<li class="uk-nav-header">网站</li>
<li><a href="http://www.mooban.cn/down/dt-c5-1.html" target="_blank">Destoon</a></li>
<li><a href="http://www.mooban.cn/down/wp-c48-1.html" target="_blank">WordPress</a></li>
<li><a href="http://www.mooban.cn/down/dede-c31-1.html" target="_blank">DeDeCMS</a></li>
<li><a href="http://www.mooban.cn/down/ec-c7-1.html" target="_blank">ECShop</a></li>
<li><a href="http://www.mooban.cn/down/dz-c56-1.html" target="_blank">Discuz</a></li>
<li><a href="http://www.mooban.cn/down/static-c143-1.html" target="_blank">HTML</a></li>
<li><a href="http://www.mooban.cn/down/qita-c225-1.html" target="_blank">其他模板</a></li>
</ul>
</div>
<div class="uk-width-1-2">
<ul class="uk-nav uk-nav-dropdown uk-panel">
<li class="uk-nav-header">APP</li>
<li><a href="http://www.mooban.cn/down/app-c6-1.html" target="_blank">AppCan</a></li>
<li><a href="http://www.mooban.cn/down/ecm-c33-1.html" target="_blank">ECMobile</a></li>
<li><a href="http://www.mooban.cn/down/ect-c66-1.html" target="_blank">ECTouch</a></li>
<li><a href="http://www.mooban.cn/down/pg-c65-1.html" target="_blank">PhoneGap</a></li>
<li><a href="http://www.mooban.cn/down/web-c64-1.html" target="_blank">WebAPP</a></li>
<li><a href="http://www.mooban.cn/down/api-c32-1.html" target="_blank">APICloud</a></li>
<li><a href="http://www.mooban.cn/down/React-c227-1.html" target="_blank">React</a></li>
</ul>
</div>
</div>
</div>
</li>
<li class="uk-parent" data-uk-dropdown="">
<a href="http://www.mooban.cn/original/">原创</a>
</li>
<li class="uk-parent" data-uk-dropdown="">
<a href="http://www.mooban.cn/source/">源码</a>
</li>
<li class="uk-parent" data-uk-dropdown="">
<a href="http://www.mooban.cn/plugin/">插件</a>
</li>
<li class="uk-parent" data-uk-dropdown="">
<a href="http://www.mooban.cn/material/">素材</a>
</li>
<li class="uk-parent" data-uk-dropdown="">
<a href="http://school.mooban.cn/">教程</a>
</li>
<li class="uk-parent" data-uk-dropdown="">
<a href="http://www.mooban.cn/know/">问答</a>
</li>
<li class="uk-parent uk-hidden-medium uk-active" data-uk-dropdown="">
<a href="http://st.mooban.cn/?fr=mooban" target="_blank">更多</a>
</li>
</ul>
<div id="destoon_member" class="uk-navbar-content uk-navbar-flip top-head-avatar">
<div class="uk-button-group"><a class="uk-button uk-button-primary uk-margin-right"
href="http://www.mooban.cn/member/register.php">免费注册</a><a
class="uk-button uk-button-primary"
href="http://www.mooban.cn/member/login.php">立即登录</a></div>
</div>
</nav>
</div>
</header>
<div class="uk-container uk-visible-small touch-nav">
<nav class="uk-navbar">
<div class="uk-grid">
<div class="uk-width-4-6">
<div class="uk-navbar-brand uk-float-left">
<a class="w1" href="http://www.mooban.cn/down/"> <i class="uk-icon-home"></i> 会员 - 魔工坊</a>
</div>
</div>
<div class="uk-width-2-6">
<nav class="uk-nav">
<a href="#offcanvas" class="uk-navbar-toggle uk-float-right w1" data-uk-offcanvas=""></a>
</nav>
</div>
</div>
</nav>
</div>
<div id="offcanvas" class="uk-offcanvas">
<div class="uk-offcanvas-bar">
<ul class="uk-nav uk-nav-offcanvas">
<li class="uk-active"><a href="http://www.mooban.cn/"><i class="uk-icon-home"></i> 首页</a></li>
<li><a href="http://www.mooban.cn/down/"><i class="uk-icon-folder-o"></i> 模板</a></li>
<li><a href="http://www.mooban.cn/original/"><i class="uk-icon-folder-o"></i> 原创</a></li>
<li><a href="http://www.mooban.cn/source/"><i class="uk-icon-folder-o"></i> 源码</a></li>
<li><a href="http://www.mooban.cn/plugin/"><i class="uk-icon-folder-o"></i> 插件</a></li>
<li><a href="http://www.mooban.cn/material/"><i class="uk-icon-folder-o"></i> 素材</a></li>
<li><a href="http://school.mooban.cn/"><i class="uk-icon-folder-o"></i> 教程</a></li>
<li><a href="http://www.mooban.cn/know/"><i class="uk-icon-folder-o"></i> 问答</a></li>
</ul>
</div>
</div>
<div class="mb-cover uk-height-1-1">
<div class="b20"></div>
<div class="uk-container uk-container-center">
<div class="uk-panel uk-panel-box">
<div class="uk-grid uk-grid-divider" data-uk-grid-margin="">
<div class="uk-width-medium-1-2">
<div class="uk-grid">
<div class="uk-width-1-5"></div>
<div class="uk-width-3-5">
<div class="uk-panel">
<div class="b35"></div>
<h1>
<a href="http://www.mooban.cn/member/login.php" class="b"><i
class="uk-icon-user mb-a"></i> 用户登录</a>
</h1>
<form id="Dform" class="uk-form" method="post" action="login.php">
<div class="uk-form-row">
<div class="uk-form-icon">
<i class="uk-icon-user"></i>
<input title=""
class="uk-form-width-large uk-form-large" name="username"
type="text" id="username" value="" placeholder="请输入账号/邮箱"
data-cached-title="注意账号或者邮箱地址的格式">
</div>
</div>
<div class="uk-form-row">
<div class="uk-form-icon uk-form-password">
<i class="uk-icon-lock"></i>
<input data-uk-tooltip="{pos:'right',animation:true}" title=""
maxlength="20" class="uk-form-width-large uk-form-large"
name="password" id="password" type="password" value=""
placeholder="请输入登录密码" data-cached-title="6-20个字符，区分大小写">
</div>
</div>
<div class="b35"></div>
<div class="uk-form-row">
<button type="submit" name="submit"
class="uk-button uk-button-primary border_radius3 uk-button-large width-100"
id="loginBtn">立 即 登 录
</button>
</div>
<div class="uk-form-row uk-text-small uk-margin-small-top">
<label class="uk-float-left"
data-uk-tooltip="{pos:'left',animation:true}"
title="选中后，一月内不用再次登录，网吧或公共计算机请勿选"><input type="checkbox"
name="cookietime"
value="1"
id="cookietime"
checked=""> 记住我</label>
<a class="uk-float-right uk-link uk-link-muted"
href="send.php">忘记密码?</a>
</div>
<div class="b20"></div>
<div class="uk-form-row uk-text-center">
<a class="uk-icon-button uk-icon-hover uk-icon-qq"
href="http://www.mooban.cn/api/oauth/qq/connect.php"
data-uk-tooltip="{pos:'bottom',animation:true}" title="QQ登录">
</a>
<a class="uk-icon-button uk-icon-hover uk-icon-weibo"
href="http://www.mooban.cn/api/oauth/sina/connect.php"
data-uk-tooltip="{pos:'bottom',animation:true}" title="微博登录">
</a>
<a class="uk-icon-button uk-icon-hover uk-icon-paw"
href="http://www.mooban.cn/api/oauth/baidu/connect.php"
data-uk-tooltip="{pos:'bottom',animation:true}" title="百度登录">
</a>
<a class="uk-icon-button uk-icon-hover uk-icon-envelope-square"
href="http://www.mooban.cn/api/oauth/netease/connect.php"
data-uk-tooltip="{pos:'bottom',animation:true}" title="网易邮箱">
</a>
<a class="uk-icon-button uk-icon-hover uk-icon-windows"
href="http://www.mooban.cn/api/oauth/msn/connect.php"
data-uk-tooltip="{pos:'bottom',animation:true}" title="微软登录">
</a>
<a class="uk-icon-button uk-icon-hover uk-icon-github"
href="http://www.mooban.cn/api/oauth/github/connect.php"
data-uk-tooltip="{pos:'bottom',animation:true}" title="Github">
</a>
</div>
<div class="b35"></div>
</form>
</div>
</div>
<div class="uk-width-1-5"></div>
</div>
</div>
<div class="uk-width-medium-1-2">
<div class="uk-grid">
<div class="uk-width-1-6"></div>
<div class="uk-width-4-6">
<div class="b35"></div>
<h1 class="uk-text-center">
<a href="javascript:;"
class="b">没有账号？立即注册</a>
</h1>
<button class="uk-button uk-button-large uk-button-success uk-width-1-1">立 即 注 册
</button>
<div class="b20"></div>
<div class="uk-text-center">
<a href="javascript:;"><img src="http://www.mooban.cn/skin/moob/img/register-reg-4.png" alt=""></a>
</div>
</div>
<div class="uk-width-1-6"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- Ucenter的用户注册和登录分析
- Winform连接SQL数据库并实现用户登录
- OpenLayers学习笔记7——使用javaBean实现用户登录
- CentOS 6.9 SSH配置用户免密码登录
- WIN7隐藏其他用户在登录界面显示的方法
- 使用AWS-用户登录
- C#使用HttpWebRequest与HttpWebResponse模拟用户登录
- Oracle 10g Audit（审计） --- 记录登录用户在Oracle中的所有操作
- CentOS 7搭建vsftp(虚拟用户方式登录)
- MySql5.6版修改用户登录密码
- 用户 'sa' 登录失败。原因: 未与信任 SQL Server 连接相关联
- 使用Struts1.x实现用户登录实例
- 用户登录的模拟 goto语句的使用
- 飞鱼开发框架(四) 窗体自动获取用户登录信息
- PLSQL Developer用户登录时提示：ORA-28000: the account is locked
- 免安装版Tomcat配置用户登录项目管理界面
- centos linux系统忘记用户登录密码的解决方案
- SqlServer sa 用户登录失败的解决方法
- 利用 Heartbleed 漏洞劫持用户登录会话
- 命令行添加用户的“作为服务登录”权利