## 登錄頁面一

相關代碼如下:
```
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
<title>APP</title>
<link rel="stylesheet" type="text/css" href="../../../css/aui.css" />
<style>
body {
background: url('image/logo-bg.png') no-repeat;
background-position: center;
background-size: cover;
position: relative;
}
.aui-content {
margin-bottom: 0;
}
.content {
position: absolute;
width: 100%;
height: 100%;
overflow: hidden;
}
.info {
position: relative;
padding: 20px 0;
width: 100%;
height: 100%;
text-align: center;
vertical-align: center;
}
.info p.title {
margin-bottom: 15px;
color: #ffffff;
font-size: 18px;
}
.logo {
width: 100%;
text-align: center;
color: #ffffff;
font-size: 36px;
padding-top: 30px;
}
.box {
position: absolute;
top: 30%;
margin: 45px;
border-radius: 5px;
overflow: hidden;
}
.box .input-group {
background: #ffffff;
background: rgba(255,255,255,0.4) !important;
color: #ff9900;
position: relative;
display: table;
border-collapse: separate;
padding: 6px 0;
}
.box .btn-group {
color: #ffffff;
position: relative;
display: table;
border-collapse: separate;
width: 100%;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
overflow: hidden;
}
.box .btn-group .aui-btn {
border-radius: 0;
margin: 0;
}
.box .input-group:after {
position: absolute;
right: 0;
bottom: 0;
left: 0;
height: 1px;
content: '';
background-color: #ffffff;
-webkit-transform: scaleY(.3);
transform: scaleY(.3);
}
.box .input-group:last-child:after {
height: 0;
}
.box .input-group .input-group-addon {
font-size: 16px;
font-weight: 400;
line-height: 1;
color: #ffffff;
text-align: center;
display: table-cell;
width: 1%;
white-space: nowrap;
vertical-align: middle;
padding: 6px 12px;
}
i.aui-iconfont {
font-size: 18px;
}
.box .input-group .form-control {
background: none;
margin: 0;
padding: 5px 0;
display: table-cell;
position: relative;
z-index: 2;
float: left;
width: 100%;
margin-bottom: 0;
border:none;
border-radius: 0;
color: #ffffff;
}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
color: #ffffff;
}
.register {
margin-top: 15px;
font-size: 14px;
color: #fff;
}
</style>
</head>
<body>
<div class="aui-content content">
<div class="info">
<div class="logo">LOGO</div>
<div class="box">
<div class="input-group">
<span class="input-group-addon"><i class="aui-iconfont aui-icon-mobile"></i></span>
<input type="number" name="mobile" id="mobile" class="form-control" placeholder="手機號"/>
</div>
<div class="input-group">
<span class="input-group-addon"><i class="aui-iconfont aui-icon-lock"></i></span>
<input type="password" name="password" id="password" class="form-control" placeholder="密碼"/>
</div>
<div class="btn-group">
<div class="aui-btn aui-btn-block aui-btn-warning" tapmode onclick="login()">登錄</div>
</div>
<p class="aui-text-center register" tapmode onclick="register()">
注冊加入
</p>
</div>
</div>
</div>
</body>
<script type="text/javascript" src="../../../script/api.js"></script>
<script type="text/javascript">
function login(){
api.closeWin({});
}
function register(){
api.openWin({
name:'register_win',
url:'register_win.html',
delay:300,
animation:{
type:'fade'
}
})
}
apiready = function(){
var header = $api.byId('aui-header');
$api.fixStatusBar(header);
api.parseTapmode();
}
</script>
</html>
```
- APP模塊
- 歡迎頁
- 頭部模塊
- 底部模塊
- 圖文列表
- 商品展示
- 文字列表
- 內容頁一
- 評論頁
- N宮格
- 獲得上一級的欄目名稱
- 搜索模塊
- 圖標
- 幻燈模塊
- 消息頁
- 個人中心
- 個人中心—我的收藏
- 個人中心—資料修改
- 個人中心—我的錢包(賬戶)
- 咨詢頁面
- APP模板
- 注冊 頁面一
- 注冊 頁面二
- 登錄 頁面一
- 登錄 頁面二
- 忘記密碼 頁面一
- 會員中心 首頁一
- 會員中心 首頁二
- 會員中心 首頁三
- 會員中心 資料修改
- 申請審核步驟
- 商品訂單一
- 游戲頁面
- 新聞列表頁
- 圖文列表頁
- 商品列表頁
- 商品詳情頁
- 聊天
- 消息列表
- 聊天界面
- 發布需求
- 前端框架
- CSS Framework
- trim 字符處理
- dom 選擇器
- 樣式
- evt 事件
- 選擇元素
- 屬性
- 文本
- 位置
- json
- 設置
- 提示
- AJAX
- storage 本地存儲
- API對象
- 常用函數
- openWin()
- closeWin()
- apiready
- fixStatusBar(header)
- api.setRefreshHeaderInfo
- api.openFrame
- randomSwitchBtn(index,name)
- APP常用圖片
- asd